2 replies [Last post]
Dodge
Offline
Regular
Last seen: 17 years 15 weeks ago
Joined: 2005-08-20
Posts: 15
Points: 0

Hi,

I can't figure out if I am implementing these styles incorrectly or if IE has limited support for them:

.headlines:first-line {
text-transform: uppercase;
background-color: #d8d8d8;
font-size: .9em;
font-weight: bold;
}

.headlines {
border: 1px solid #cccccc;
border-right: none;
border-top: none;
background-color: #ffffff;
padding: 5px;
margin: 0 0 5px 0;
}

The problem is that IE6 SP2 - does not recognize the background-color value in the .headlines class. Well it does but not until about "haven’t been on the roads lately" in example html below - that is when I see the first hint of the white background color:

<div class="headlines">Uniform School Times Highlight Start Of TISD Classes<br />
<em>Sunday, 21st August 2005 at 4:22PM</em><br />
TYLER -- Don't forget those uniform start and end times going into effect Monday 
for the Tyler ISD. That's 8 a.m. till 3 p.m. for elementary schools, 8:40 till 3:40 for middle 
schools, and 8:55 till 3:55 at John Tyler and Robert E. Lee High Schools.

<a href="news.php">More...</a></div>



<div class="headlines">Police Offer Tips And Help As School Starts<br />
<em>Sunday, 21st August 2005 at 4:23PM</em><br />
TYLER -- Tyler police do their part as TISD kicks off the school year Monday -- 
with revised start times and school buses that haven’t been on the roads lately.

<a href="news.php">More...</a></div>

These stories and more on our <a href="news.php">LOCAL/STATE NEWS</a> page.

Thanks for any insight on this. Smile FF and Opera both interpret this correctly.

Dodge

briski
briski's picture
Offline
Elder
London
Last seen: 10 years 25 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

:first-line issue/questions

Hmm using just this code independently it works fine in IE 6 for me. Do you have a link to the whole page?

Dodge
Offline
Regular
Last seen: 17 years 15 weeks ago
Joined: 2005-08-20
Posts: 15
Points: 0

:first-line issue/questions

Hi briski,

Apparently it had something to do with the #contenthome (middle column) being positioned relatively. I say that because when I removed it the issue disappeared...

Here is the "before" and "after" for that div:

Before

#contenthome {
margin: 5px 185px 0 210px;
position: relative;
font-size: .8em;
}

After

#contenthome {
margin: 5px 185px 0 210px;
font-size: .8em;
}

I see no ill effects in the layout having removed the position property so I should be good to go now. Smile

Thanks
Dodge