content layout diffrence in IE and Firefox

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

content layout diffrence in IE and Firefox

Post by Kaylen »

I have very diffrent behavoiur in IE and Firefox for my content.

If I put this code in my css:
div#main {
      padding: 0 0 0 1px;
      width: 60%;
      margin: 0  0 0  14%;
      background: #FFFFFF;
      float: left;
    }

In Firefox the page looks like FF1.jpg, and thats fine, But in IE it look like IE1.jpg, wich is not good at all because the login block is then moved down and also the white area to the left of the content is to big.

But if I put this code in my css:
div#main {
      padding: 0 0 0 1px;
      width: 60%;
      margin: 0  10% 0 0  ;
      background: #FFFFFF;
      float: left;
    }
In IE it looks like IE2.jpg wich is good, but hen it looks like FF2.jpg in forefox, wich is bad again...

Can someone help me out??

Thnx! Barbera


[attachment deleted by admin]
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

Re: content layout diffrence in IE and Firefox

Post by Kaylen »

2nd pic

[attachment deleted by admin]
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

Re: content layout diffrence in IE and Firefox

Post by Kaylen »

3nd pic

[attachment deleted by admin]
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

Re: content layout diffrence in IE and Firefox

Post by Kaylen »

4th pic

[attachment deleted by admin]
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: content layout diffrence in IE and Firefox

Post by Dr.CSS »

get it good in Ff...directly under it the good for IE CSS...

* html body div#main {
      padding: 0 0 0 1px;
      width: 60%;
      margin: 0  10% 0 0  ;
      background: #FFFFFF;
      float: left;
    }

if that's the good IE...
this will hide it from Ff but IE will take it... might not validate CSS...
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

Re: content layout diffrence in IE and Firefox

Post by Kaylen »

I have added * html body before div#main, and in IE it still looks good, but in FF the content is now over the entire width of the page and the login block is now beneath all the content on the right side....
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: content layout diffrence in IE and Firefox

Post by Dr.CSS »

do you have both of them... like this... one right after the other...

div#main {                        this is for Ff...
      padding: 0 0 0 1px;
      width: 60%;
      margin: 0  0 0  14%;
      background: #FFFFFF;
      float: left;
    }
* html body div#main {    this is for IE... it's known as the 'box model hack' or some such thing...
      padding: 0 0 0 1px;
      width: 60%;
      margin: 0  10% 0 0  ;
      background: #FFFFFF;
      float: left;
    }
Kaylen
Forum Members
Forum Members
Posts: 128
Joined: Mon May 01, 2006 5:24 pm

Re: content layout diffrence in IE and Firefox

Post by Kaylen »

no i didn't have both of them, sorry I miss understood  :o

It work now with both of them , thanks very much!!
Post Reply

Return to “Layout and Design (CSS & HTML)”