Hi, You should add a DIV between C1 to clear the float.
like that: <HTML> <head><style>@import "output-serialize.css";</style></head> <BODY id="c0"> <DIV id="c1"> <DIV id="c3"> <UL id="c4"> <LI class="c5"> <A href="http://mail.live.com"; class="c6"> <IMG height="20" width="25" src="http://tk2.stb.s-msn.com/i/ B6/32E46DE281A68B9C33FC582D2569D.gif" alt="Hotmail" class="c7"> </IMG> <SPAN class="c8"> <STRONG> Hotmail</STRONG> </SPAN> </A> </LI> </UL> </DIV> <DIV id="c10"> <DIV id="c11"> <UL class="c12"> <LI class="c13"> <A href="http://travel.msn.com/default.aspx"; class="c14"> Air Tickets/Travel</A> </LI> </UL> <UL class="c12"> <LI class="c13"> <A href="http://election.msn.com"; class="c14"> Election 2008</A> </LI> </UL> <UL class="c12"> <LI class="c13"> <A href="http://astrocenter.astrology.msn.com/msn/DeptHoroscope.aspx? When=0&Af=-1000&VS" class="c14"> Horoscopes</A> </LI> </UL> <UL class="c12"> <LI class="c13"> <A href="http://music.msn.com"; class="c14"> Music</A> </LI> <LI class="c13"> <A href="http://www.msnbc.msn.com/"; class="c14"> News</A> </LI> </UL> <UL class="c12"> <LI class="c13"> <A href="http://tech.msn.com"; class="c14"> Tech & Gadgets</A> </LI> </UL> </DIV> </DIV> <div style="clear:both"></div> </DIV> </BODY> </HTML> On Nov 5, 5:16 am, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote: > Hi, > > I have the following html and css test page: > In which i have a top-most DIV tag with css id = c1. And in my css > stylesheet, I have the background color set to white. But when I load > it in firefox, i don't see the while background at all. > > Can you please tell me what am I missing? > > html > ============================== > <HTML> > <head><style>@import "output-serialize.css";</style></head> > <BODY id="c0"> > > <DIV id="c1"> > > <DIV id="c3"> > <UL id="c4"> > <LI class="c5"> > <A href="http://mail.live.com"; class="c6"> > <IMG height="20" width="25" src="http://tk2.stb.s-msn.com/i/ > B6/32E46DE281A68B9C33FC582D2569D.gif" alt="Hotmail" class="c7"> > </IMG> > <SPAN class="c8"> > <STRONG> > Hotmail</STRONG> > > </SPAN> > </A> > </LI> > > </UL> > </DIV> > <DIV id="c10"> > <DIV id="c11"> > <UL class="c12"> > <LI class="c13"> > <A href="http://travel.msn.com/default.aspx"; class="c14"> > Air Tickets/Travel</A> > </LI> > > </UL> > <UL class="c12"> > > <LI class="c13"> > <A href="http://election.msn.com"; class="c14"> > Election 2008</A> > </LI> > > </UL> > <UL class="c12"> > <LI class="c13"> > <A href="http://astrocenter.astrology.msn.com/msn/DeptHoroscope.aspx? > When=0&Af=-1000&VS" class="c14"> > Horoscopes</A> > </LI> > > </UL> > <UL class="c12"> > <LI class="c13"> > > <A href="http://music.msn.com"; class="c14"> > Music</A> > </LI> > <LI class="c13"> > <A href="http://www.msnbc.msn.com/"; class="c14"> > News</A> > </LI> > > </UL> > <UL class="c12"> > <LI class="c13"> > <A href="http://tech.msn.com"; class="c14"> > Tech & Gadgets</A> > > </LI> > > </UL> > </DIV> > </DIV> > > </DIV> > > </BODY> > </HTML> > > css: > ========================== > #c0 { > background-color:#EEEEEE; > background-position:0 0; > background-repeat:repeat-x; > color:#333333; > font-family:tahoma,sans-serif; > font-size:70%; > line-height:1.2em; > margin:0; > padding:0; > text-align:center;} > > #c1 { > background-color:#FFFFFF; > border:1px solid #CCCCCC; > margin:0; > padding:0;} > > #c2 { > margin:0;} > > #c3 { > float:left; > margin:0; > padding:6px 0; > width:20.5%;} > > #c4 { > list-style-type:none; > margin:0 0 0 9px; > padding:0;} > > .c5 { > border-right:1px solid #CCCCCC; > clear:left; > float:left; > margin:0; > white-space:nowrap; > width:13.6em;} > > .c6 { > background-color:transparent; > color:#07519A; > display:block; > position:relative; > text-decoration:none; > top:-3px;} > > .c7 { > border:medium none; > clear:left; > float:left; > margin:0 0.4em -1em 0;} > > .c8 { > cursor:pointer; > float:left; > padding-top:6px;} > > #c9 { > border-right:1px solid #CCCCCC; > clear:left; > float:left; > margin:0; > white-space:nowrap; > width:13.6em;} > > #c10 { > float:left; > margin:0; > padding:6px 0; > width:78.9%;} > > #c11 { > margin-right:0; > width:auto;} > > .c12 { > float:left; > list-style-type:none; > margin:0; > padding:0; > width:19.9%;} > > .c13 { > clear:left; > margin:0; > padding:0.25em 0 0.2em; > white-space:nowrap;} > > .c14 { > background-color:transparent; > color:#07519A; > text-decoration:none;} > > #c15 { > background:transparent url(i/new.gif) no-repeat scroll right top; > color:#07519A; > padding-right:25px; > text-decoration:none;} > > #c16 { > background:#FFFFFF url(i/shico.gif) no-repeat scroll 5.2em -2px; > color:#C41E1E; > font-weight:700; > padding-right:2em; > text-decoration:none; > > } --~--~---------~--~----~------------~-------~--~----~ -- You received this because you are subscribed to the "Design the Web with CSS" at Google groups. To post: [email protected] To unsubscribe: [EMAIL PROTECTED] -~----------~----~----~----~------~----~------~--~---
