Topic: Another CSS bug in IE? Pages that link to <a href="https://ozoneasylum.com/backlink?for=10714" title="Pages that link to Topic: Another CSS bug in IE?" rel="nofollow" >Topic: Another CSS bug in IE?\

 
Author Thread
kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 04-16-2002 22:29 Edit Quote

I just lost my written post when my IE window suddenly disappeared so I'm going to make it a little shorter:

I've created a little CSS-only navigation and added 20 buttons to it to show you which strange things IE is doing with it: www.kussatz.com/asylum/cssnav1.html

All the buttons are using the same CSS classes, and as you might guess the text is intended to start at the same horizontal position in every line. But IE 6 moves it some more pixels to the left with every line I add while Opera 6 and Netscape 6.2 are displaying it without any problems.

Did anyone come across a similar 'effect' before and knows a way to get rid of this IE-only behaviour? Or did I overlook a strange mistake in the CSS code? I'd be happy about any help (of course!)

kuckus

CPrompt
Maniac (V) Inmate

From: there...no..there.....
Insane since: May 2001

IP logged posted posted 04-17-2002 05:15 Edit Quote

I don't really see any problems. The Contacts are all lined up and then the sublinks are intented and they all line up with each other. Or am I misreading your problem

Are the sublinks supposed to be lined up with the main buttons?

Later,
C:\


~Binary is best~

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 04-17-2002 08:20 Edit Quote

You can't see it? That's strange. Which browser are you using?

Here's how I see it when I'm looking at it with IE6 / WinXP: www.kussatz.com/asylum/cssnav1.gif

Again, I don't have any problems looking at it with NN 6 or Opera...

InI
Paranoid (IV) Mad Scientist

From: Somewhere over the rainbow
Insane since: Mar 2001

IP logged posted posted 04-17-2002 11:02 Edit Quote

The poster has demanded we remove all his contributions, less he takes legal action.
We have done so.
Now Tyberius Prime expects him to start complaining that we removed his 'free speech' since this message will replace all of his posts, past and future.
Don't follow his example - seek real life help first.

CPrompt
Maniac (V) Inmate

From: there...no..there.....
Insane since: May 2001

IP logged posted posted 04-17-2002 13:56 Edit Quote

kuckus: I am using IE6. Now my resolution is 1280x1024 at home but at work it is 800x600. When I just looked at it at work the positioning was all screwed up. My guess is that Ini is right, there is something wrong with you absolute positioning.

I can take a look at it when I get home.


Later,
C:\


~Binary is best~

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 04-18-2002 19:15 Edit Quote

Thanks for the guesses so far. But the thing is, I don't think I'm using any positioning at all! (Apart from margins and paddings)

My CSS looks like this:

.mainnav { background: #ffffff; margin: 12px 0px; border-top: 1px solid #444400; border-bottom: 1px solid #444400; cursor: pointer; }
.mainnav p { font-family: "Lucida Sans Unicode", Arial, sans-serif; margin: 5px 20px; }
.subnav { margin: -12px 0px 0px 45px; border-left: 1px solid #444400; padding: 5px 0px 5px 7px; }
.subnav p { font-family: "Lucida Sans Unicode", Arial, sans-serif; font-size: 13px; margin: 0px; cursor: pointer; }

And that's the HTML code, this code is repeated twenty times on the sample page:

<div>
<div id="nav_kontakt" class="mainnav" onclick="location.href='#';">
<p><a href="#">Kontakt</a></p>
</div>
<div class="subnav">
<p onclick="location.href='#';"><a href="#">Webmaster</a></p>
</div>
</div>

Any other ideas?

Phil
Bipolar (III) Mad Scientist

From: Eastbourne, UK.
Insane since: Mar 2000

IP logged posted posted 04-18-2002 22:07 Edit Quote

IE 5 the text drops away to the left a couple of pixels on every line 1024 x 768

Weird............

www.scansped.co.uk

CPrompt
Maniac (V) Inmate

From: there...no..there.....
Insane since: May 2001

IP logged posted posted 04-18-2002 22:19 Edit Quote

Why do you have this:

.subnav p { font-family: "Lucida Sans Unicode", Arial, sans-serif; font-size: 13px; margin: 0px; cursor: pointer; }

this:

.subnav { margin: -12px 0px 0px 45px; border-left: 1px solid #444400; padding: 5px 0px 5px 7px; }


and this:

<p onclick="location.href='#';"><a href="#">Webmaster</a></p>


???

That is where your problem is I think. That <p onclick . . > is causing some problems. I took it out and it seemed to work fine. Try it and see.


Later,
C:\


~Binary is best~

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 04-19-2002 07:01 Edit Quote

CPromt: Thanks for the hint again

I took the CSS lines apart and came to the result that this padding

.subnav { padding: 5px 0px 5px 7px; }

is causing the special effect in IE. I guess I'll try to move it into another div and see if it helps.
BTW, removing the onclick... didn't change anything, that would have been strange indeed!

kuckus

[edit: Problem sorted out, thanks a lot! Though I'd be happy about an explanation for this strage behaviour... it's still the same code, the only differece is that's it's on its own div now. Really weird! ]

[This message has been edited by kuckus (edited 04-19-2002).]

CPrompt
Maniac (V) Inmate

From: there...no..there.....
Insane since: May 2001

IP logged posted posted 04-19-2002 15:07 Edit Quote

Glad that you fixed it. Sometimes CSS and IE do some strange things!. I have seen borders disappear when you scroll and all kinds of crazy shit.



Later,
C:\


~Binary is best~

kuckus
Bipolar (III) Inmate

From: Berlin (almost)
Insane since: Dec 2001

IP logged posted posted 04-19-2002 15:51 Edit Quote

Heh, it's not as if only IE did strange things with CSS code:

Have a look at this with Netscape 6.2 (6.0 might also 'work') and move your mouse over the navigation.



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu