homepage Welcome to WebmasterWorld Guest from 174.129.130.202
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

    
CSS in IE6 for PC will NOT behave
i'm going CRAZY!
alarix




msg:1182707
 8:58 pm on Mar 27, 2003 (gmt 0)

I'm working on a site that works great on Mac NN (7) and IE (5) in OS9 and OSX and also is fine in PC NN (except 4) and PC IE 5. it even works in AOL except a BODY background image that won't show up (but I suspect that's AOL's annoying image compression scheme)

But in PC IE 6 my formatting goes nuts.

on PC IE 6.0.2 it does one thing, on 6 in windows 2000 it does another, on 6 in windows NT it does something else.

I was going to put in the code. But since I've tried literally about 20 variations on it, and no matter what I do, IE6 screws it up, I don't see the point. And yes, my code validates. My CSS also validates, although with minor warnings.

So I'll ask more generally, is there some problem with CSS in IE6 on PC that I should know about? In general it seems to have a mind of its own when interpreting positioning and padding, while the other platforms handle what I'm doing just fine.

If I'm allowed to post a link, let me know and I will.

 

SethCall




msg:1182708
 9:42 pm on Mar 27, 2003 (gmt 0)

just checkin: are you using a doctype?

DrDoc




msg:1182709
 10:08 pm on Mar 27, 2003 (gmt 0)

...and if you are, is it a Strict or Transitional? No DOCTYPE, or using Transitional, will cause IE6 to behave like IE5.5... You mention testing in IE5, but have you tested in IE5.5 too?

Can you describe more what exactly is the problem. Is it width/height, positioning, floating layers... or what? I'm sure we'll be able to narrow it down for you. Just be patient :)

alarix




msg:1182710
 10:24 pm on Mar 27, 2003 (gmt 0)

here's the doctype:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">

i should mention i'm pretty new at this CSS stuff :) and no, have not tested 5.5 since I don't have any access to it at the moment ... (i know, download ....)

specifics:

i have images in the background
on top of them are text, or in some cases text using a clip: rect with overflow: scroll

like so:
HTML--------------------

<td>
<img src="pic.gif" class="inTheBack">
<div class="contentHeader">
contains either plain text (with span styles) or nested divs with scrolling clipped rect text
</div>
</td>

CSS---------------------

.inTheBack {
position: absolute;
z-index: 2;
}

.contentHeader {
position:relative;
left:25px;
top:20px;
z-index: 30;
width:320px;
height: 340px;
text-align: left
}

the main problem in general seems to be that despite being "stuck" inside a TD, my image moves left or right "outside" of the TD boundaries, while the text stays inside it

it has occurred to me that putting divs in a td is maybe not the best way to go, but like i said, i'm new .... :)

it just now occurs to me that the image has a position of absolute, the div is relative, and the TD is nothing. maybe there' s something there .....

more info?

DrDoc




msg:1182711
 10:43 pm on Mar 27, 2003 (gmt 0)

First, change the Doctype to Strict :)
... and we'll go from there ;)

SuzyUK




msg:1182712
 10:57 pm on Mar 27, 2003 (gmt 0)

alarix are you trying to make that text overlap the image?
(re: "intheback" for the classname)

if so you could set the image as a background image as that to the cell (no-repeat and postion from the top/left as required.)

Then pad the text part (top and left to make it "overlap") as required

Suzy

alarix




msg:1182713
 11:06 pm on Mar 27, 2003 (gmt 0)

hmm. I'm afraid of a Strict doctype! but ok, i'll try ....

and i know about td background="someimage.gif" but when I use that the code would not validate and the td background images would not show up in AOL browsers ... or more specifically, they would not show up in AOL on mac OS X

alarix




msg:1182714
 11:07 pm on Mar 27, 2003 (gmt 0)

suzy, i think i misunderstood you. you mean to give the TD a style background image? interesting.

SuzyUK




msg:1182715
 11:10 pm on Mar 27, 2003 (gmt 0)

Yes alarix that's what I meant

example:
CSS:

.inTheBack {
background-image: url(pic.gif);
background-repeat: no-repeat;
width: 320px;
height: 340px;
vertical-align: top;
}

.contentHeader {
padding-top: 25px;
padding-left: 20px;
}

HTML:

<td class="inTheBack">
<div class="contentHeader">
contains either plain text (with span styles) or nested divs with scrolling clipped rect text
</div>
</td>

Suzy
<oops> missed a closing tag..</oops>

alarix




msg:1182716
 11:57 pm on Mar 27, 2003 (gmt 0)

the background image works great! not sure about on the PC yet, waiting for a response ....

however, I also tried very quickly the STRICT doctype and wrreaked havoc on my tables! sigh. all the TDs have some padding now or something that I have no idea how to get rid of .... but ONLY in netscape 7 mac

i have toi take a break, but will be back.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved