| Autor | Zpráva | ||
|---|---|---|---|
| kuku Profil * |
#1 · Zasláno: 30. 5. 2010, 11:43:56
Dobrý den,
chtěl bych poprosit někoho zda by nedokázal vyřešit problém s css na prvek html UL Li, konkrétně na změnu obrázku prvkem list-style-image. Dostal jsem od kodera hotový kod, bohužel jsem zjistil že to dělá jednu nemilou věc: když najedu myší na odkaz vše funguje normálně, ale pokud nejedu mimo text vedle položky tak se obrzek mění taktéž. Nevěděl by někdo prosím jak tento probém vyřešit?Předem moc děkuji. http://onoko.cz/pokus/index.html kody:
#boxy{
float:left;
border: solid 0px;
width:998px;
min-height:249px;
background:url(../images/boxy_prechod.gif) repeat-x;
margin-left:10px;
}
#box_1{
float:left;
width:295px;
height:205px;
background:url(../images/box_12.png) no-repeat;
margin-left:51px;
margin-top:12px;
padding:0;
}
#box_1 ul{
list-style:none;
padding:0;
text-align:left;
font-family:Arial, Helvetica, sans-serif;
color:#000;
font-size:12px;
margin-top:109px;
margin-left:35px;
}
#box_1 li{
padding-bottom:8px;
list-style-image:url(../images/sipka_box-1.gif);
}
#box_1 li{
text-decoration:none;
color:#000;
list-style-image:url(../images/sipka_box-1.gif);
}
#box_1 li a{
text-decoration:none;
color:#000;
list-style-image:url(../images/sipka_box-1.gif);
}
#box_1 li:hover{
text-decoration:none;
color:#000;
list-style-image:url(../images/sipka_box-1-hover.gif);
}
#box_1 li a:hover{
text-decoration:none;
color:#1d3e0c;
list-style-image:url(../images/sipka_box-1-hover.gif);
}
/**************************box2*********************************/
#nadpis_box_1{
float:left;
font-family:Tahoma, Geneva, sans-serif;
font-size:14px;
color:#254b0d;
text-transform:uppercase;
text-align:left;
margin-left:21px;
margin-top:22px;
}
a 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" />
<link rel="stylesheet" type="text/css" href="css/styl3.css" />
<title>Untitled Document</title>
</head>
<body>
<span id="box_1">
<span id="nadpis_box_1">Internetové<br /> stránky</span>
<ul>
<li><a href="#">Pokus 1</a></li>
<li><a href="#">aaaaaaaaaaaaaaaaaaaaaaaa</a></li>
<li><a href="#">Pokus 2</a></li>
<li><a href="#">xxxxxxxxxxxxxxxxxx</a></li>
</ul>
</span>
</body>
</html> |
||
| Plaváček Profil |
#2 · Zasláno: 30. 5. 2010, 11:58:29
kuku:
Nezkoumal jsem podrobně, ale mělo by stačit zrušit tuto definici, která je trochu zbytečná: #box_1 li:hover{
text-decoration:none;
color:#000;
list-style-image:url(../images/sipka_box-1-hover.gif);
}
|
||
| kuku Profil * |
hmmm po umazání této defince se bohužel již šipky nemění vůbec :-/. Ale děkuji.
|
||
| kuku Profil * |
#4 · Zasláno: 30. 5. 2010, 12:04:36
nic méně jste mě nakopnul a problem jsem už našel, stačolo přidat do tého definice délku. MOc dídky!!!
|
||
| Bubák Profil |
#5 · Zasláno: 30. 5. 2010, 13:21:31
Doporučuji list-style-image nepoužívat, důvod: http://teststranek.kvalitne.cz/odrazky1/
Jak na menu s obrázkovou odrážkou koukni na http://teststranek.kvalitne.cz/menu-odrazkove-1/ Výhodouje, že hover funguje také v IE6. Pokud je třeba, ale není problém deklarovat odkaz blokový a dát mu šířku, což však je vlastnost, kterou nechceš. |
||
| kuku Profil * |
#6 · Zasláno: 30. 5. 2010, 15:08:50
Moc díky, tohle přesně jsem potřeboval, ten nápad s tou délkou nebyl moc dobrej...díky
|
||
|
Časová prodleva: 14 let
|
|||
0