[CSS] Menu z obrazków + hover

0

Witam!

Jestem początkujący w HTML + CSS. Mam taki problem, ponieważ mam obrazek i po najechaniu na niego zmienia się na inny. Ok, pięknie. Tylko jak dodam drugi to jak najadę na pierwszy to drugi przesuwa się o 5px-10px. A jak najadę na drugi to jest w porządku tylko na ten pierwszy muszę najechać trochę wyżej, też nie wiem czemu.

Chyba przez te marginesy ;) Ale nie jestem pewien

CSS:

@charset "utf-8";
/* CSS Document */
#html, body {
        background-color: #efefef;
    }

#logo { 
         background-image: url(img/Logo.png); 
         height: 66px; 
         width: 230px;
         margin: 0px auto;
         margin-top: 5px;
   }

#linia {
        background-image: url(img/linia.png);
        height: 19px;
        width: 629px;
        margin: 0px auto;
        margin-top: 5px;
    }

#glowna {
        background-image: url(img/glowna.png);
        height:24px;
        width:134px;
        margin-top: -5px;
        margin-left: 400px;
    }

#glowna:hover {
        background-image:url(img/glowna_active.png);
        height: 29px;
        width:147px;
        margin-top: -5px;
        margin-left: 392px;
    }

#omnie {
        background-image: url(img/omnie.png);
        height:20px;
        width:53px;
        margin-top:-20px;
        margin-left:570px;
    }

#omnie:hover {
            background-image:url(img/omnie_active.png);
            height:25px;
            width:71px;
            margin-top: -20px;
            margin-left:562px;
    }

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>diesellas Design</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="logo"></div>
<div id="linia"></div>
<a href="index.html"><div id="glowna"></div></a>
<a href="omnie.html"><div id="omnie"></div></a>
</body>
</html>
0

1) Zmieniasz wysokość i szerokość na hover i zmieniasz jeszcze marginesy.. - nie rób tego, będzie ok (a marginesy ujemne - powiedzmy, że są dla zaawansowanych i na razie nie używaj ich w ogóle).
2) Poczytaj o css sprites,
3) Element <div> nie może zawierać się w <a> (choć teoretycznie nie powinno powodować to błędów wyświetlania>,
4) <a> z kolei nie może zawierać się bezpośrednio w <body> (a to już na pewno nie wpłynie na wyświetlanie).
5) Twoje linki nie mają jakiegokolwiek opisu, więc dla Google mało znaczą

0

miało być z <a>

0

problem jest taki ze nie mam tych obrazkow - nie widze co i gdzie ucieka, wiem tylko, ze zmienia rozmiar i sie przesuwa, czego na 99,999% nie powinieneś w tym przypadku robić. spakuj calosc w zipa i podrzuc

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0