Posted by Jonathan N. Little on 09/01/06 14:30
edgy wrote:
> In this div, I get a little horizontal line of the background colour after
> the last image. How can I make sure the image is the very last thing in the
> div?
>
> <div id="navigation">
> <IMG SRC="circle_top.jpg">
> <h3><p><ul>
> <li><a href="tabs.html">Tabs</a></li>
> <li><a href="lyrics.html">Lyrics</a></li>
> <li><a href="links.html">Links </a></li><
> /ul></p></h3>
> <IMG SRC="circle_bottom.jpg">
> </div>
>
>
Els answered your image problem but I noticed your H3 oddity! Hedding
elements H1-H6 are only supposed to contain inline elements so you
should have neither the paragraph P or list UL with your heading. I bet
you are just using the H3 to make the text in your list larger, right?
Don't just style the list for the size text you want!
....
<style type="text/css">
/* Make images stay above and below list */
#navigation IMG { display: block; }
/* Make list in nav bigger and bold */
#navigation UL { font-size: 1.2em; font-weight: bold; }
</style>
<body>
div id="navigation">
<img src="circle_top.jpg" alt="">
<ul>
<li><a href="tabs.html">Tabs</a></li>
<li><a href="lyrics.html">Lyrics</a></li>
<li><a href="links.html">Links </a></li>
</ul>
<img src="circle_bottom.jpg" alt="">
</div>
....
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
[Back to original message]
|