+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Wyśrodkowanie bannera i problem z menu (/thread-wy%C5%9Brodkowanie-bannera-i-problem-z-menu)
Strony:
1
2
Wyśrodkowanie bannera i problem z menu - MartinTcV - 23-04-2011
RE: Wyśrodkowanie bannera i problem z menu - fisiuxxx - 23-04-2011
Jeżeli chcesz, by po najechaniu na obrazek pojawiał się inny obrazek, robisz w ten sposób:
Przykładowo:
Kod:
#button2 {
display: block;
background-image: url(images/ch_08.png);
width: 72px;
height: 29px;
}
#button2:hover {
display: block;
background-image: url(images/ch_08_hover.png);
width: 72px;
he}
RE: Wyśrodkowanie bannera i problem z menu - Kartofelek - 23-04-2011
I jest to zły sposób
Zły, bo grafika wczyta się dopiero po najechaniu. Od tego używa się css sprite, ale o tym było już milion razy nawet na tym forum. Poszukaj dobrze
RE: Wyśrodkowanie bannera i problem z menu - MartinTcV - 23-04-2011
No dobra poszukam, ale teraz bardziej problem, co mam złego napisane w kodzie HTML, że te obrazki od menu się nie wyświetlają?
RE: Wyśrodkowanie bannera i problem z menu - Kartofelek - 24-04-2011
.buttony {wszystkie) są blokowe. Ok - to dobrze. Ale one nie mają overflow:hidden, a ich zawartość jest pusta (pusty link). Więc się nie wyświetlają. Daj im overflow:hiden
RE: Wyśrodkowanie bannera i problem z menu - MartinTcV - 24-04-2011
Dobra. Teraz mam coś takiego.
Kod HTML
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=windows-1250"/>
<title>Ośrodek Szkolenia Kierowców "CHMARA" w Tczewie</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div class="wrapper">
<div class="header">
<div class="clr"></div>
</div>
<div class="margines"></div>
<div class="menu_nav">
<div class="belka1"></div>
<ul>
<li class="active"><a href="index.html"><div class="button1"></div></a></li>
<li><a href="#"><div class="button2"></div></a></li>
<li><a href="#"><div class="button3"></div></a></li>
<li><a href="#"><div class="button4"></div></a></li>
<li><a href="#"><div class="button5"></div></a></li>
</ul>
<div class="clr"></div>
</div>
</div>
</body>
</html>Kod CSS
Kod:
.html, .main {
padding:0;
margin:0;
}
.wrapper {
margin: 0 auto;
}
.clr {
clear:both;
padding:0;
margin:0;
width:100%;
font-size:0;
line-height:0;
}
.logo {
padding:0;
float:left;
width:auto;
}
.header {
background-image: url(images/ch_03.png);
margin:0 auto;
padding:0;
width:980px;
height:218px;
}
.logo {
padding:0;
float:left;
width:auto;
}
.header, .content, .menu_nav, .fbg, .footer, form, ol, ol li, ul, .content .mainbar, .content .sidebar {
margin:0;
padding:0;
}
.menu_nav {
margin:0 auto;
padding:0;
width:980px;
height:29px;
}
.margines {
padding:1px;
}
.belka1 {
margin:0 0;
padding:0;
width:310px;
height:29px;
background-image: url(images/ch_06.png);
.button1 {
display: block;
overflow:hidden;
background-image: url(images/ch_07.PNG);
width: 72px;
height: 29px;
}
.button2 {
display: block;
overflow:hidden
background-image: url(images/ch_08.PNG);
width: 72px;
height: 29px;
}
.button3 {
display: block;
overflow:hidden
background-image: url(images/ch_09.PNG);
width: 72px;
height: 29px;
}
.button4 {
display: block;
overflow:hidden
background-image: url(images/ch_10.PNG);
width: 72px;
height: 29px;
}
.button5 {
display: block;
overflow:hidden
background-image: url(images/ch_11.PNG);
width: 72px;
height: 29px;
}
.menu_nav ul {
list-style:none;
height:29px;
float:left;
}A nadal jest tak samo ;/ Obrazki się nie wyświetlają, banner jest całkiem po lewej... Gdybym miał jakiś szablon ze stylami, na którym mógłbym się wzorować to jakoś bym sobie poradził.
RE: Wyśrodkowanie bannera i problem z menu - Kartofelek - 25-04-2011
Zacytuję wielkiego mędrca, którego każdy powienien znać:
".buttony {wszystkie) są blokowe. Ok - to dobrze. Ale one nie mają overflow:hidden, a ich zawartość jest pusta (pusty link). Więc się nie wyświetlają. Daj im overflow:hiden "
Czemu wstawiasz div w link? To jest złe. Przeczytaj raz jeszcze co ci napisałem i zastosuj się do tych rad. div id="button" itp powinien mieć dodatkowo overflow:hidden. Tracę w wiarę w internet
RE: Wyśrodkowanie bannera i problem z menu - MartinTcV - 25-04-2011
No dałem przecież buttonom overflow:hidden. Bynajmniej tak mi się wydaje
W zawartości dałem diva, bo jakiś odnośnik musi chyba być. Jak mam to umieścić? Nigdzie nie mogę tego znaleźć, bo każdy tworzy menu przy użyciu CSS; używa z tego tła, obramowań, tekstu itp., a mało kto używa poprostu obrazków.
RE: Wyśrodkowanie bannera i problem z menu - Kartofelek - 25-04-2011
miales tak:
<li><div class="button2"><a href="#"></a></div></li>
masz tak:
<li><a href="#"><div class="button4"></div></a></li>
Oba są złe.
Powinno być tak:
<li><a href="xxxx">Nazwa linka</a></li>
Resztę już napisałem powyżej. Poczytaj sobie o overflow:hidden; text-indent; display:block. I nawet nie musisz szukać po necie, bo setki razy na tym forum pisałem o identycznym problemie
RE: Wyśrodkowanie bannera i problem z menu - MartinTcV - 25-04-2011
Aha
Nie czytałem o tym overflow, ale z tego co napisałeś skumałem o co biega Chodzi o to, że odpowiada to za to, iż nie wyświetla nazw odnośników? Czyli w tym przypadku co napisałeś, nie wyświetli: Nazwa linka?A skąd będzie wiadomo jaki obrazek ma iść do jakiego linka? Skoro nigdzie nie ma diva? ;(