[solved] IE6 problem, IE7 is oke

[Frankvanlogten]

Hello,

I Use the following template for the website:










{* The above JavaScript is required for CSSMenu to work in IE *}



Motorclub M&M's Elshout - Gastenboek
{stylesheet}




     
         
         
     


     
      {bulletmenu} 
     
     
     

          {content}
     
     


      {* Start Footer. Edit the footer in the Global Content Block called "footer" *}
 
 
      {global_content name='footer'}


   
  {* End Footer  *}








And the following CSS:

.body { font-family: verdana; }



.header {
        margin:0px 0px 0px 0px;
        padding:0px;
        height:150px;
        background-color: #3a53a4;
        }


div.wrapper {
          {background:url(menu.jpg) repeat-y 0 0;overflow:auto};
        }

.menu  {
        float:left;
        margin:0px 0px 0px 0px;
        padding:0px;
        width:200px;
        }


.content{
        background-color: white;
        margin-top:10px;
        margin-left:225px;
        }



.footer {
        clear: both;
        height:50px;
        background-color: #3a53a4 ;}


This is shown in IE7 perfect but in IE6 not!!!
Menu background starts 10px below!!!
What to do to fix this?

[Dr.CSS]

Well just to guess I would say it's from the content margin-top:10px, your wrapper is around the content, not sure if you wanted it to just wrap the menu...

A link would work better...

[Frankvanlogten]

Mark,

I made some screencaptures.
ie6.jpg show it in Internet Explorer 6.
You can see that the menu also start 10px from the top like the content.

ie7.jpg show it in Internet Explorer 7.
You can see here that the menu start at the top and content 10px below

[lollipop27]

Hi there, I have a question, why do you use two {{}} in the wrapper? Is this sort of a hack?

Code: Select all

div.wrapper {
          {background:url(menu.jpg) repeat-y 0 0;overflow:auto};
}

and why do you add the background in the wrapper and not in the menu?

[Frankvanlogten]

Hi,

Don't know why i do this.
Just asked for a solution and someone give this as a solution.

I'm going to change background to set in menu and hopefull is this the solution for mine problem.
Done this, but then the background won't fill complete the "content" height.
Background just stops below the last link in menu, while menu height is higher.

Just changed this back, without the extra {}.

[streever]

hey,

yes, it's that 10px margin you have on the menu.

Change that to PADDING.

Also:
make sure you understand this--the css box model--it sounds weird but it's so simple, okay?

Margin DOES NOT carry the color
Padding does

[Frankvanlogten]

Oké.

I changed it to padding and now it's oké.
Thanks.

[streever]

Great !!

I'm very happy to have helped you!