Отображение меню сайта

[pavelslap]

Добрый день уважаемые!

У меня есть выпадающее меню, сделанное на html/css. Javascript не использован.
На моём компьютере работает хорошо. Но как только я его перенёс на хостинг начались проблемы:
1) Появились отступы слева от каждого пукнта меню в результате чего всё меню съехало.
2) При наведении на заголовок меню, его пункты сдвигаются вправо (чего быть не должно).

Вот, собственно сайт: http://www.talsutautasnams.lv/

В чём, по вашему может быть проблема?
Всем заранее благодарен.

Да, и не открывайте в Internet Explorere, для него ещё не сделал, этим займусь позже.

Хмм.. может быть дело в DOCTYPE ?

[TranceSmile]

Да уж. Что нельзя было весь css в файлы раскидать?

[pavelslap]

Я понял, что какой-то фрагмент этого кода влияет на это неверное отображение. Можете подсказать, какой именно?

html * { font-size: 98% }
body { font-family: verdana,arial,helvetica,sans-serif; font-size: 100.01%;color: #000;background: #212121;text-align: left;}
body { text-align: center;margin-right:5px;margin-left:5px;margin-top:0px;}
img {padding:0px;margin:0px;}

option { padding-left: 0.4em;font-size:12px; }
* html body * { overflow:visible; }
* html iframe, * html frame { overflow:auto; }
* html frameset { overflow:hidden; }
html { height: 100%; margin-bottom: 1px; }

fieldset, img { border: 0 solid; }
ul, ol, dl { margin: 0 0 1em 1em }
li { margin-left: 1.5em; line-height: 1.5em; }
dt { font-weight: bold; }
dd { margin: 0 0 1em 2em; }
blockquote { margin: 0 0 1em 1.5em; }

#header{position:relative; width:940px;width:"940px";z-index:1000;}
#header_start, #nav, #main, #page_wrap, #footer { clear:both; }

#header {position:relative; z-index:1000;margin:0px;padding:0px;}
#header ul{list-style: none;padding: 0;margin: 0; padding-top:15px; vertical-align:bottom;}
#header li{float: left; list-style: none;font-size:11px; font-weight:bold; color:#fff;vertical-align:bottom; }
.ttabs img{margin-right:3px; }

#frame {width:940px;width:"940px";margin:0 auto;padding:0 0px;text-align:left;background-color:#f5f6f1;min-height:510px;height:auto !important;height:515px;}

  .hideboth #col3 {margin-left: 0; margin-right: 0}
  .hidecol1 #col3 {margin-left: 0; margin-right: 200px}
  .hidecol2 #col3 {margin-left: 200px; margin-right: 0}

  .hideboth #col1, .hideboth #col2 {display:none}
  .hidecol1 #col1 {display:none}
  .hidecol2 #col2 {display:none}

   .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
  }

  .clearfix { display: block }
  .floatbox { overflow:hidden }
  #ie_clearing { display: none }

  .subcols, .subcols_oldgecko {
    width: 100%;
    overflow:hidden;
  }
 
  .subcols li,.l25 li, .r25 li {text-align:left; list-style:none}
  .subcols ul {text-align:center;width:100%}
  
  .subcols_oldgecko { float:left }

  .l, .l25, .l33, .l38, .l50, .l62, .l66, .l75  {float: left; }
  .r, .r25, .r33, .r38, .r50, .r62, .r66, .r75  {float: right; margin-left: -5px; }

  .l25, .r25 { width: 25% }
  .l33, .r33 { width: 33.333% }
  .l38, .r38 { width: 38.2% }
  .l50, .r50 { width: 50% }
  .l62, .r62 { width: 61.8% }
  .l66, .r66 { width: 66.666% }
  .l75, .r75 { width: 75% }
  .l, .r { width: auto }

  .subc  { padding: 0 0.5em; }
  .subcl { padding: 0 1em 0 0 }
  .subcr { padding: 0 0 0 1em }

  .skip, .hideme, .print {
    position: absolute;
    top: -1000em;
    left: -1000em;
    height: 1px;
    width: 1px;
  }

  .skip:focus, .skip:active {
    position: static;
    top: 0;
    left: 0;
    height: auto;
    width: auto;
  }

#main { background:#fff;padding:0px;margin:0 auto;float: left;width:100%;width:"100%";z-index:1000;}
#page_wrap{ float: left;color:#000;width:100%;width:"100%";max-width: 90em;margin: 0 auto;padding:0px; text-align:left;background:#fff;min-height:515px;height:510px;}  
#cont_wrap { float:none; clear:both;margin:0px;margin-left: 0px; padding:0px;width: 98%;position:relative;}  
#col1_content, #col2_content, #col3_content { position:relative; }
  
.r1w, .r2w{float:left;}
.r1w{width:285px;}
.r2w{width:auto;}
.secSpace{margin-bottom:17px;}
.upOne{margin-top:-1px;}
.dBlock{display:block;}
.cBoth{clear:both;}
  
p { line-height: 1.5em; margin: 0 0 1em 0; }
p.inline {color: inherit;background-color: inherit;display: inline;padding: 0px;}

  ul, ol, dl { line-height: 1.5em; margin: 0 0 1em 1em }
  li { margin-left: 1.5em; line-height: 1.5em }

  dt { font-weight: bold }
  dd { margin: 0 0 1em 2em }

  cite, blockquote { font-style:italic }
  blockquote { margin: 0 0 1em 1.5em }

  pre, code { font-family: monospace; font-size: 1.1em; }

  acronym, abbr {
    letter-spacing: .07em;
    border-bottom: .1em dashed #c00;
    cursor: help;
  }

  .note {background: #dfd; padding: 1em; border-top: 1px #bdb dotted; border-bottom: 1px #bdb dotted;}
  .important {background: #ffd; padding: 1em; border-top: 1px #ddb dotted; border-bottom: 1px #ddb dotted;}
  .warning {background: #fdd; padding: 1em; border-top: 1px #dbb dotted; border-bottom: 1px #dbb dotted;}

  .float_left { float: left; display:inline; margin-right: 1em; margin-bottom: 0.15em;  }
  .float_right { float: right; display:inline; margin-left: 1em; margin-bottom: 0.15em;  }
  .center { text-align:center; margin: 0.5em auto }

  hr {
    color: #fff;
    background:transparent;
    margin: 0 0 0.5em 0;
    padding: 0 0 0.5em 0;
    border:0;
    border-bottom: 1px #eee solid;
  }

[xDyPx]

 li { margin-left: 1.5em; line-height: 1.5em }

переделай на

 li { margin-left: 0; line-height: 1.5em }

и отступы пропадут.
(В двух местах встречается эта строчка.)

[Lala_]

Здравствуйте.
Есть большая проблема, собственно из за которой я и зарегистрировалась тут, и из-за которой мучаюсь неделю...
Для нашего сайта я использовала меню из этого шаблона http://osc4.template-help.com/wt_30957/index.html , но так как я центрировала, и ширина body у меня 66% , меню естественно тоже пришлось уменьшать..Я его уменьшила, были сдвиги , убрала..Но ! При переходе по вкладкам они как бы мигают...не чётко переходят и при переходе чуток мигают..И это только в ИЕ, в Хроме и Опере работает шикарно..

Вот html :

<div class="main" align="center">
<nav>

<div align="center">
<ul id="menu">

<li id="menu_active" >
<a href="#" class="style28">Baş səhifə<br>
<span class="style31">HomepaGE</span></a></li>
<li><a href="#" class="style29">AvadanlIqlar<br>
<span class="style31">Who we are</span></a></li>
<li><a href="#" class="main style11 style30">Xidmətlər <br>
<span class="style31">What we do</span></a></li>
<li><a href="#" class="style29">İnformasiya<br>
<span class="style31">Solutions</span></a></li>
<li><a href="#" class="style29">HaqqImIzda<br>
<span class="style31">Stay in touch</span></a></li>
<li><a href="#" class="style29">ƏlaqƏ<br>
<span class="style31"> STAY in touch</span></a></li>
</ul>
</div>
</nav>

И CSS :

.main { margin: 0 auto; width:100%; background:center;}


#menu { width: 100%; overflow:hidden; }
#menu li {float:left; padding-left:10px;}
#menu li a{display:block; width:100px; height:45px; background:url(menu_bg.gif) right bottom no-repeat; font-weight:bold; color:#071f26; text-transform:uppercase; padding:20px 0 0 0; text-decoration:none;}
#menu li a span{ display:block; font-size:9px; color:#aaaaaa; font-weight:normal; margin-top:-4px;}
#menu li a:hover, #menu #menu_active a{ background:url(menu_active.gif) 0 0 no-repeat; width:100px; color:#fff; text-shadow: #cd100a}
#menu li a:hover span, #menu #menu_active a span{ color:#fff; text-shadow: #cd100a}

[Lala_]

Спасибо, разобралась)

[pavelslap]

Сообщение от xDyPx

 li { margin-left: 1.5em; line-height: 1.5em }

переделай на

 li { margin-left: 0; line-height: 1.5em }

и отступы пропадут.
(В двух местах встречается эта строчка.)

большое спасибо!