lehrfeld
03-29-2005, 04:56 PM
I hope I'm not repeating any of the posts, but I'm having these two problems that I'm trying to take care of. First of all, I'm trying to format links using CSS to display as a block and to all be on the same line, but for some reason each "block" link displays on a new line, as if there was some hidden line break on the page. There isn't, though. Sorry I can't show an example of what I mean, but here is the CSS code I'm using for it:
div#menu a:link {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:visited {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:active {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:hover {
display: block;
width: 100px;
height: 30px;
background-color: #9999FF;
color: #000000;
border: 1px solid #330099;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
Does anybody know why each link displays on a new line? Additionally, here is the HTML code for the menu:
<div id="menu"><a href="http://jon.lehrfeld.net/index.html">Home</a>
<a href="http://jon.lehrfeld.net/pages/about.html">About</a>
<a href="http://jon.lehrfeld.net/pages/memories.html">Memories</a>
<a href="http://jon.lehrfeld.net/pages/hp.html">Harry Potter</a>
<a href="http://jon.lehrfeld.net/pages/music.html">Music</a>
<a href="http://jon.lehrfeld.net/pages/rants.html">Rants</a>
<a href="http://jon.lehrfeld.net/pages/poetry.html">Poetry</a>
<a href="http://jon.lehrfeld.net/pages/outbound.html">Outbound</a>
<a href="http://jon.lehrfeld.net/pages/contact.html">Contact</a>
</div>
Anyway, all that's the first problem. I'll post the second problem later if I can get this problem fixed. Thanks!
- Jonathan
div#menu a:link {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:visited {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:active {
display: block;
width: 100px;
height: 30px;
background-color: transparent;
color: #CCCCCC;
border: 1px solid #CCCCCC;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
div#menu a:hover {
display: block;
width: 100px;
height: 30px;
background-color: #9999FF;
color: #000000;
border: 1px solid #330099;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
}
Does anybody know why each link displays on a new line? Additionally, here is the HTML code for the menu:
<div id="menu"><a href="http://jon.lehrfeld.net/index.html">Home</a>
<a href="http://jon.lehrfeld.net/pages/about.html">About</a>
<a href="http://jon.lehrfeld.net/pages/memories.html">Memories</a>
<a href="http://jon.lehrfeld.net/pages/hp.html">Harry Potter</a>
<a href="http://jon.lehrfeld.net/pages/music.html">Music</a>
<a href="http://jon.lehrfeld.net/pages/rants.html">Rants</a>
<a href="http://jon.lehrfeld.net/pages/poetry.html">Poetry</a>
<a href="http://jon.lehrfeld.net/pages/outbound.html">Outbound</a>
<a href="http://jon.lehrfeld.net/pages/contact.html">Contact</a>
</div>
Anyway, all that's the first problem. I'll post the second problem later if I can get this problem fixed. Thanks!
- Jonathan