making DIV, thats works for FF & IE Options

[themusicworld205...]

how can i make a DIV that works the same in internet explorer and in firefox
cause i have been having A LOT of problems that my profile looks good in firefox but sux in internet explorer

these are examples which is better for the both browsers?
or give your examples

CODE

<style>
.div1 {
background-color:000000; color:000000;
border:0px solid; border-color:silver;
width:400px; height:100px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-250px; margin-top:150px;
visibility:visible;}
</style>


<div class="div1">
content
</div>

or

CODE

<div style="position: absolute; overflow:hidden; left:50%; margin-left:125px; _margin-top: 415px; margin-top: 415px; top: 50%px; width: 225px; height: 150px; background-color:CF0000;">
CONTENT
</div>

HELP i been trying to solve this since along time !!!

[vintage-toile]

ah i have been trying to solve this issue too for ever! i'm so pleased someone else brought it to light
only issue is...mine look fine in IE but not in firefox..
looking at the two codes given i think the second works best in firefox, and the first works best in IE. that's what happens when i use each one anyway, have you got IE AND firefox to take a look?
mm i'll check back here, because i've been looking for answers for so long too and im sure loads of others have!

[Smarmosaur]

i think you just have to get lucky.
if you find that one works best in one browser, and the other in another, nobody's stopping you from using them both!

however, if it's positioning you're having problems with, there's a logical solution. but i think you're confusing your browser with all of this:

CODE

margin-left:125px; _margin-top: 415px; margin-top: 415px; top: 50%px;

for positioning from the left, use either left or margin-left. for the top, use either top or margin-top, don't use all of them.

anyways, back to my solution. let's say you're going to use left and top. i noticed you already have this solution once in your code.

CODE

left: #px;
_left: #px;
top: #px;
_top: #px;

what this does is apply different positions to different browsers. the normal left and top will read in firefox. _left and _top will read only in IE.

[vintage-toile]

oh wow, that actually makes total sense! thankyou so much.
i'll try that out on my next layout.

[themusicworld205...]

like this ?

CODE

<div style="position: absolute; overflow:hidden; left: 125px; _left: 123px; top: 100px; _top: 100px; width: 800px; height:575px; background-color:transparent;">
CONTENT
</DIV>

[Smarmosaur]

yep, that's exactly how you do it.
that solution works on nearly anything, not just positioning, like height, width, background color, background position, etc...
you name it, it most likely works. :]

[vintage-toile]

i have the biggest smile on my face.
honestly, this issue has been annoying me so much lately.
awesome

[themusicworld205...]

THANX
FOR EVERYONE THAT HELPED ME SOLVE THIS PROBLEM!