/    Sign up×
Community /Pin to ProfileBookmark

DIV PaddingMargin is different in netscape and IE6

Copy linkTweet thisAlerts:
Jun 10.2004

Hello all

I am having problem with padding and margin widths. If I get it right in IE, the text will be too far up in Netscape, if I get it right in Netscape the text is too far down in IE.

here is the coding I am using:

.divtoprowwhitecol {
position: relative;
white-space: normal;
padding-top: 30px;
padding-left: 200px;
vertical-align: top;
text-align: left;
float: left;
clear: right;
width: 800px;
}

By the way it is only padding-top that I am having a problem with.

Does anyone have any suggestions?

thanks in advance all.

to post a comment
CSS

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@Daniel_TJun 10.2004 — Well, for starters, get rid of vertical-align, as it won't do anything. Your problem is most likely caused by IE's misinterpretation(to put it lightly) of the CSS box model. In IE, when there is padding applied to an element, it includes it in the width of the element, rather than expanding the element with the padding. You could use a hack, like the following one, or you could use margins on elements inside the element, rather than padiding. If you [i]must[/i] use padding, set it up like this:.divtoprowwhitecol {
position: relative;
white-space: normal;
padding-top: 30px;
padding-left: 200px;
text-align: left;
float: left;
clear: right;
width: 600px !important;
width: 800px;
}
What the !important statement does is tell standards browsers to only listen to the value defined in the line which it is present in. Therefor, it will ignore the second [i]width[/i] attribute. However, since IE doesn't recognize this, it will use the definition that appears last in the styles, which would be the second one.

-Dan
Copy linkTweet thisAlerts:
@David_HarrisonJun 10.2004 — It's only the padding-top, not padding-left.

Can we see the page? That's not really enough to go on. It may be due to the position:relative but I can't be certain.
Copy linkTweet thisAlerts:
@Daniel_TJun 10.2004 — [i]Originally posted by lavalamp [/i]

[B]It's only the padding-top, not padding-left.[/B][/QUOTE]
Huh? Last time I checked, it screwed up both...
Copy linkTweet thisAlerts:
@David_HarrisonJun 10.2004 — [i]Originally posted by smercer [/i]

[B]it is only padding-top that I am having a problem with.[/B][/QUOTE]
Copy linkTweet thisAlerts:
@Daniel_TJun 10.2004 — Ah, oops ? Should probably have payed more attention to the stuff after the code... ?
Copy linkTweet thisAlerts:
@smercerauthorJun 10.2004 — Thanks guys

it was the !important solution that fixed the problem. I had forgoten all about !important attribute

Thanks all.
Copy linkTweet thisAlerts:
@David_HarrisonJun 10.2004 — OK, now I am confused. :S
Copy linkTweet thisAlerts:
@Daniel_TJun 10.2004 — [i]Originally posted by lavalamp [/i]

[B]OK, now I am confused. :S [/B][/QUOTE]
Ditto! !important isn't an attribute, but rather a hack. And it should only have affected it if you were using a fixed height.. unless you used !important on the padding-top...
×

Success!

Help @smercer spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.2,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...