Opera margin: {} problem

Forum Moderators: open

Message Too Old, No Replies

Opera margin: {} problem

margin: 40px auto;

madcat

5:43 pm on May 29, 2002 (gmt 0)


margin: 40px auto;

-Should simply drop my <div> 40px from the top and center it within the larger <div>...I've tried it in each margin: {combination;}.

Opera for some reason wants me to achieve the effect like so:


margin-top: 40px;
margin-right: auto;
margin-left: auto;

I read somewhere this can crash Netscape 4.x. margin: x x x x; is the way to go. Have you dealt with this matter yet? By the way, margin-top: 40px; works like a charm, it's when I go for the auto center things flip out.

Thanks again,
M

papabaer

8:56 pm on May 29, 2002 (gmt 0)

Hello madcat, no, I haven't seen that as of yet... Interesting. Which version of Opera are you running?

DrDoc

8:57 pm on May 29, 2002 (gmt 0)

Have you tried setting 'margin: 40px 0px 0px 0px;' and then use 'text-align: center;' in the outer DIV?

madcat

9:42 pm on May 29, 2002 (gmt 0)

hey what's up papabaer- v6.03

DrDoc- No, I haven't tried that, I will, but this shouldn't be an issue really. The <div> should have no problem following a simple margin declaration; I think no matter what the combo (i.e. margin: {whatever}).>>>

Madcat

DrDoc

9:48 pm on May 29, 2002 (gmt 0)

Yeah, it should work using 'margin: 40px auto;' (especially in a browser like Opera) .. but you never know.

Which DTD are you using?

madcat

9:55 pm on May 29, 2002 (gmt 0)

XHTML 1.1 DTD


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<?xml version="1.0" encoding="ISO-8859-1" ?>

papabaer

3:35 am on May 30, 2002 (gmt 0)

Madcat, thanks for pointing out the css rendering anomaly. I wanted to look closer so I created a few test pages. As the old saying goes "a picture is worth a thousand words..."

Here are the three test pages (screen captures) with commentary. Example one [bigbaer.com] � two [bigbaer.com] � three [bigbaer.com]

Madcat, I was able to get Opera to render div{margin:auto; margin-top:40px} which is a little more compact than div{margin-top:40px;margin-right:auto;margin-left:auto;}

DrDoc, your thread regarding declaring a padding value for the body ties in nicely here as you will see.

Cross-Browser Training 101
... just when we thought it was safe to go back in the water! ;)
- papabaer

madcat

5:40 am on May 30, 2002 (gmt 0)

... just when we thought it was safe to go back in the water!

haha no doubt man. I was very surprised to find 6.03 so non-cooperative.


div{margin:auto; margin-top:40px}

Under the circumstances, that will make for an elegant solution. As a bonus it will allow for a less restrictive bottom-margin.

It seems to me any UA nowaday should be getting margins correct right off the bat-- If they're capable of making a browser with lightning quick speed especially;)

Thanks again-
M