Jump to content

Navigational Links


N-Bomb(Nerd)

Recommended Posts

Hello, I'm just trying to learn a bit about css here, and I've seem to run into a problem.

 

I'm planning on having my navigational links(buttons) on the left side of my website banner. However, when I view my buttons in FF all looks well.. but the whole line across to the right is a link.. when in fact I just want the button to be a link. With IE however it looks and works just fine. Could someone take a look at my source here and tell me whats wrong?

 

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="buttons.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>

<a href="#"><div id="nav_btn">Button1</div></a>
<a href="#"><div id="nav_btn">Button2</div></a>
<a href="#"><div id="nav_btn">Button3</div></a>
<a href="#"><div id="nav_btn">Button4</div></a>


</body>
</html>

 

buttons.css

body {
background-image: url(./images/background.png);
background-repeat: repeat-x; 
background-color:black;
}

a {
text-decoration: none;
}


#nav_btn {
background-color: #FF0080;
width: 60px;
height: auto;

font-family: Verdana, Geneva, sans-serif;
font-size: 9px;
color: #FFF;

padding: 5px;
}

#nav_btn:hover {
background-color: #FFF;
color: #000;
}

Link to comment
https://forums.phpfreaks.com/topic/139815-navigational-links/
Share on other sites

why are you making divs to hold each link wouldnt a ul be way easier in the long run

 

and more semantic

 

I don't exactly know.. rofl! I'm not very good at html/css.. I kinda just skipped that and jumped into php and shit.. and now that I've coded the php part for a website I want to make.. well I kinda need to learn html/css.

 

I just tried to use ul, and I can't exactly get it work like I can with the div's. Is there a reason one shouldn't really use div's here?

Link to comment
https://forums.phpfreaks.com/topic/139815-navigational-links/#findComment-731447
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.