Skocz do zawartości

Marcel Barski

Rejestracja: 29 gru 2015
Poza forum Ostatnio: lut 02 2016 00:57
-----

Moje tematy

Problem z hover

02 lutego 2016 - 00:57

Mam problem mianowicie hover wyświetla się za daleko z boku i nie wiem jak go przesunąć i tekst się przy tym rozjeźdża
 
 
http://pastebin.com/k3NGqWSN
http://pastebin.com/DprZ1Z6M

Rozjazd grafik

29 grudnia 2015 - 13:56

Mam problem, gdy dodaje coś obok jakiś element to natychmiast rozjeżdża się 2, gdy dodaje tekst div'y obok idą w dół jak to naprawić?

/*
CSS file created with:Instantblueprint - Create a web project framework in seconds.
http://instantblueprint.com
Project: projekt
File: css/style.css
Last edited: December 28, 2015, 1:05 am
*/

/* Main */
body {
background:url(../images/background.png);
color:#000;
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}

#wrapper {
margin:0 auto;
width:1280px;
}

#menu {
width:1348px;
height:111px;
background:url(../images/menu.png)center;
}
#menu ul{
font-size:18px;
color:#000;
list-style:none;
text-shadow:1px 1px 1px #000;
    margin-top:0px;
    margin-left:700px;
}
#menu ul li{
text-align:center;
    width:170px;
        float:left;
            line-height:17px;
    display:block;
            }
            #menu ul li a{
    width:170px;
    height:20px;
    display:block;
    text-decoration:none;
    color:#000;
    padding-bottom:25px;
    text-align:center;
}
#slogan{
margin-left:150px;
}
#cien {
background:url(../images/cien.png) center;
margin-left:130px;
width:947px;
height:15px;
}

#slider {
width:1348px;
height:349px;
background:url(../images/slider.png) center;


}
#box {
width:312px;
height:213px;
background:url(../images/box.png);
margin-top:15px;
margin-left:145px;
    display:block;

}
#box1 {
width:312px;
height:213px;
background:url(../images/box.png);
margin-top:15px;
margin-left:323px;
    display:block;
}
#box2 {
width:312px;
height:213px;
background:url(../images/box.png);
margin-top:15px;
margin-left:323px;
    display:block;
}
#duzy {
width:632px;
height:213px;
background:url(../images/duzy.png);

margin-left:145px;
}
#newsletter{
width:312px;
height:213px;
background:url(../images/box.png);

margin-left:650px;
    display:block;
}
#akcja{
width:962px;
height:137px;
background:url(../images/akcja.png);
margin-top:15px;
margin-left:145px;
}
/* stopka */
#footerm{
background:url(../images/menu-stopka.png);
width:1348px;
height:266px;
margin-top:15px;
}
#stopka{
background:url(../images/stopka.png);
width:1348px;
height:47px;
}
/* ikonki */
#strzalka{
background:url(../images/up.png);
width:32px;
height:32px;
margin-left:30px;

}
#strzalka:hover{
background:url(../images/up_1.png);
width:32px;
height:32px;
margin-left:30px;}
#glowna1{
background:url(../images/grid.png);
width:64px;
height:64px;
float:right;
margin-right:531px;
margin-top:-45px;
}
#glowna1:hover{
background:url(../images/grid_1.png);

}
#nowosci{
background:url(../images/news.png);
width:64px;
height:64px;
float:right;
margin-right:-234px;
margin-top:-45px;
}
#nowosci:hover{
background:url(../images/news_1.png);

}
#kontakt{
background:url(../images/mail.png);
width:64px;
height:64px;
float:right;
margin-right:-405px;
margin-top:-45px;
}
#kontakt:hover{
background:url(../images/mail_1.png);

}

#menu ul li a:hover{
    color:#cf4e23;
.post {
}

.postmeta {
}


<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
<title>projekt</title>
<link rel="stylesheet" type="text/css" href="css/reset.css" media="screen">
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen">
</head>
<body>


<div id="menu"><div id="slogan">
</br>
<font size="6">Logo strony</font></br>
<font size="3">Slogan reklamowy</font>
</div>
<div id="glowna1"></div>
<div id="nowosci"></div>
<div id="kontakt"></div>


<ul>
<li class="glowna"><a href='#'>Strona główna</a></li>
<li class="nowosci"><a href='#'>Nowości</a></li>
<li class="kontakt"><a href='#'>Kontakt</a></li>
</ul>
</div>


<div id="slider">
</div>
<div id="box">

<div id="box1">
<div id="box2">
</div>
</div>
</div>
<div id="cien"></div>
<div id="duzy">
<div id="newsletter">
</div>
</div>
<div id="akcja">
</div>
<div id="footerm">

</div>
<div id="stopka">
<div id="strzalka">
</div>
</div>

</div><!-- End: wrapper -->
</body>
</html>