menu shown wrong in Internet explorer 7 ?

[schwoortz]

(just guessing) try

display: inline-block;
float: left;
min-width: ??;
min-height: ??;

(at least for all IE but IE6 and older)

[Roych]

I have tried to find the problem in my css but no luck so far!
Im not a coder but understand some!

Here is my CSS code:

Code Select Expand

html {


margin: 0;


padding: 0;


}


body {


background: #CDC2B3 url(images/bg.gif);


text-align: center;


color: #5F3E2F;


font: 8px verdana, sans-serif;


margin: 0px;


padding: 20px 0px 20px 0px;


}


a {


color: #5F3E2F;


text-decoration: none;


}


a:hover {


color: #1D110B;


text-decoration: underline;


}


img {


border: 0px;


}


#wrapper {


width: 778px;


margin: auto;


text-align: left;


}


#header p {


font-size:12px;


font-style:italic;


color:#FFFFFF;


font-family:Georgia, "Times New Roman", Times, serif;


}


#header p.more {


padding-right: 22px;


}


#header {


height: 320px;


background: url(images/header.jpg) no-repeat;


}


#header div {


padding: 183px 213px 0px 82px;


}


#header p {


margin: 0px;


padding: 0px;


}


#header a {


color:#;


}


#nav {


width: 740px;


height:48px;


margin: 0px 0px 0px 20px;


background-image:url(images/nav.gif);


background-repeat:no-repeat;


display:inline;


float:left;





}


#nav a {


font-size:15px;


font-style:italic;


color:#260403;


font-family:Georgia, "Times New Roman", Times, serif;


margin: 15px 0px 10px 0px;


padding: 0px 20px 0px 20px;


float:left;


border-right-width: 2px;


border-right-style: inset;


border-right-color: #76644f;


}


#nav a:hover {


color:#862e06;


text-decoration:none;


}

.menu_current {


text-decoration:underline;
}


.lastchild {


border-right: none 0px !important;


}


#body {


background: url(images/body_bg.gif) repeat-y;


clear: both;


width: 100%;


}


#body-top {


background: url(images/body_top.gif) no-repeat;


}


#body-bot {


background: bottom url(images/body_bot.gif) no-repeat;


padding: 21px 25px 15px 42px;


}


#about-box {


float: left;


width: 315px;


}


#about-box ul {


margin-left: 8px;


}


#express-box {


float: right;


width: 327px;


}


#foot {


width: 738px;


margin-left: 20px;


background: url(images/foot_bg.gif) repeat-y;


}


#foot-top {


background: url(images/foot_top.jpg) no-repeat;


}


#foot-bot {


background: bottom url(images/foot_bot.gif) no-repeat;


padding: 13px 21px 12px 28px;


}


#what-box {


float: left;


width: 332px;


}


#what-box img.left {


margin-left: 10px;


}


#what-box ul {


float: left;


margin-left: 2px;


width: 184px;


}


#news-box {


float: right;


width: 316px;


}


#news-box ul {


float: left;


margin-left: 2px;


width: 184px;


}


#footer {


margin: 14px;


text-align: center;


}


ul {


margin: 0px;


padding: 0px;


}


li {


margin: 0px;


padding: 0px 0px 0px 20px;


list-style: none;





}


p {


margin-top: 0px;


margin-bottom: 10px;


}


div.narrow-text {


margin-right: 18px;


}


img.left {


float: left;


padding-right: 14px;


padding-bottom: 16px;


}


#body p.more {


padding-top: 6px;


}


#news-box p.more {


padding-top: 0px;


margin-top: 0px;


}


p.more {


text-align: right;


}


.clear {


clear: both;


}



I think that somewhere in this part of the code is the problem:

Code Select Expand

#nav {


width: 740px;


height:48px;


margin: 0px 0px 0px 20px;


background-image:url(images/nav.gif);


background-repeat:no-repeat;


display:inline;


float:left;





}


#nav a {


font-size:15px;


font-style:italic;


color:#260403;


font-family:Georgia, "Times New Roman", Times, serif;


margin: 15px 0px 10px 0px;


padding: 0px 20px 0px 20px;


float:left;


border-right-width: 2px;


border-right-style: inset;


border-right-color: #76644f;


}


#nav a:hover {


color:#862e06;


text-decoration:none;


}


Thx!

[chio]

The output of showmenu2 is exactly the same in every browser - because it runs on the server and not in your browser.
If there is a css-problem, you have to look if you have ported the template well.

[Roych]

This is my index.php code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">



<head>

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE6" />

<meta name="description" content="<?php page_description(); ?>" />

<meta name="keywords" content="<?php page_keywords(); ?>" />

<meta http-equiv="Content-Type" content="text/html; charset=<?php
if(defined('DEFAULT_CHARSET')) { echo DEFAULT_CHARSET; } else
{ echo 'utf-8'; }?>" />



<title><?php page_title(); ?></title>



<link rel="stylesheet" type="text/css" href="

<?php echo TEMPLATE_DIR; ?>/style.css" media="screen" />



</head>



<body>



<div id="wrapper">

<div id="header">
</div>
<div id="nav"><?php show_menu(1); ?>

</div>



  <div id="body">



    <div id="body-top">



      <div id="body-bot">



        <div id="about-box">



          <h2>

            <?php page_content(1); ?>

          </h2>

        </div>



        <div id="express-box">



          <h2>

            <?php page_content(2); ?>

          </h2>

        </div>



        <div class="clear"></div>



      </div>



    </div>



  </div>



  <div id="foot">



    <div id="foot-top">



      <div id="foot-bot">



        <div id="what-box">



          <h2>

            <?php page_content(3); ?>

          </h2>

        </div>



        <div id="news-box">



          <h2>

            <?php page_content(4); ?>

          </h2>



        </div>



        <div class="clear"></div>



      </div>



    </div>



  </div>



  <div id="footer">



    <p><strong>        <?php page_footer(); ?>

</a></strong></p>



  </div>



</div>



</body>



</html>

<?php MiniCounter(1 , "Klikov/Hits: " , " [Danes/Today: " , "]" ) ?>

Thx!
R.

[Roych]

Hi

I have made a WB template from another css template and it works fine. But when someone tries to view the page in internet explorer 7 the menu is shown wrong it is not in a straight line but its shown in steps like this:

RIGHT
link1 | link2 | link3 ....

WRONG
link1 |
         link2 |
                  link3 |
                           link4 |

I tried everithing but nothing seems to work!
I tried:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE6" />

Not working either

Everything looks right in Firefox and all the other browsers even in IE8 everything looks fine only IE7 what should I do?

Thanks in advance!

R.