Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML]Nieprawidłowe wyświetlanie się menu, problem z pikselem
Baku12345
post
Post #1





Grupa: Zarejestrowani
Postów: 46
Pomógł: 1
Dołączył: 23.04.2011

Ostrzeżenie: (0%)
-----


Witam
Mam pewien problem z menu. Pod firefoxem, Operą i Safari wszystko wyświetla się ok, natomiast pod IE występuje różnica jednego piksela pomiędzy wyświetlanym menu po lewej a tekstem po prawej. Nie ma też odstępu pomiędzy menu a polem z treścią. Nie potrafię sobie z tym poradzić. Poniżej umieszczam fragment kodu w xhtml i css.

XHTML

Kod
<!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="pl" lang="pl">

<head>
<meta name="description" content="Opis" />
<meta name="keywords" content="Słowa kluczowe" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="style.css" type="text/css" />
</head>

<body>

<div id="strona">
    
      <div id="nawigacja">
    <ul>
        <li><a href="#">Opcja 1</a></li>
        <li><a href="#">Opcja 2</a></li>
        <li><a href="#">Opcja 3</a></li>
        <li><a href="#">Opcja 4</a></li>
    </ul>
    </div>
    
    <div id="tekst">
    Tekst po prawej
    </div>
    
    <div id="glowna_tresc">
        To jest treść na stronie
    </div>

</div>

</body>
</html>


CSS

Kod
body {
    font-size: 11px;
    background: #C60;
    }
    
#strona {
    width: 600px;
    margin: 0 auto;
    }
    
#nawigacja {
    background: #FFC;
    border-top: 1px #ccc solid;
    }
    
#nawigacja ul {
    margin: 0;
    padding: 10px 0;
    /*line-height: 1.4;*/
    }
    
#nawigacja ul li {
    list-style: none;
    display: inline;
    background: blue;
    }
    
#nawigacja ul li a {
    text-decoration: none;
    color: #fff;
    /*font-weight: bold;*/
    padding: 10px 10px;
    }
    
#nawigacja ul li a:hover {
    background: #fff;
    color: #000;
    }
    
#tekst {
    margin: -24px 13px 11px 0;
    text-align: right;
    color: #fff;
    background: #F33;
    padding-right: 30px;
    }
    
#glowna_tresc {
    background: #FFF;
    width: 100%;
    height: 500px;
    }


Zauważyłem, że po ustawieniu odstępu

line-height: 1.4;

i pogrubienia

font-weight: bold;

występują problemy (również na pozostałych przeglądarkach), dlatego je wyłączyłem, ale jeśli to możliwe to chciałbym zachować te parametry.
Proszę o pomoc w rozwiązaniu tego problemu.

Poniżej umieszczam link z gotowym plikiem

Kod
http://turbobit.net/hi5lhrdiu361.html


Pozdrawiam
Maciej

Ten post edytował Baku12345 27.07.2012, 00:17:43
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 27.09.2025 - 18:22