Autor Zpráva
alex
Profil *
Dobrý den, potřeboval bych radu ohledně toho jak na toto menu naaplikovat a:hover. Vymyslel jsem si toto menu, kde každý knoflík je rozděl na 3částí levou, střed kde je text a pravou. Každá z částí má jiné pozadí a všechny části se chovají jako jeden knoflík což je účelem. Problém, ale je že nevim jakým způsobem bych na tyto tři části měl naaplikovat hover, aby se jim všem při najtí myší změnilo pozadí. Zkoušel jsem aplikovat takto na všechny tři části, ty lf,ct,rg, ale při najetí to vůbec nereaguje, nevěděl by někdo prosím jak tento můj kod rozchodit případně zjednodušit ? Předem děkuji moc:

 #lfbutt_a  a:hover{
 background-image: url("images/web/hrmenu/druhepozadi.png");}

Html:
  <div id="hrmenu">
  <a href="index.html" class="odka"><li><li id="lfbutt_a"></li><li id="ctbutt_a">Blog</li><li id="rgbutt_a"></li></li></a>
  <a href="live_streams.htm" class="odkp"><li><li id="lfbutt_b"></li><li id="ctbutt_b">Live Streams</li><li id="rgbutt_b"></li></li></a>
  <a href="live_scores.htm" class="odkp"><li><li id="lfbutt_b"></li><li id="ctbutt_b">Live Scores</li><li id="rgbutt_b"></li></li></a>
  <a href="live_streams.htm" class="odkp"><li><li id="lfbutt_b"></li><li id="ctbutt_b">Tools</li><li id="rgbutt_b"></li></li></a>
  <a href="live_streams.htm" class="odkp"><li><li id="lfbutt_b"></li><li id="ctbutt_b">School of Betting</li><li id="rgbutt_b"></li></li></a>
  <a href="live_streams.htm" class="odkp"><li><li id="lfbutt_b"></li><li id="ctbutt_b">Forum</li><li id="rgbutt_b"></li></li></a>
  </div>

CSS:
 #hrmenu {
 margin-top:5px;  
 width: 1000px;
 height: 18px;
 margin-left: auto;
 margin-right: auto;}
 
 #hrmenu li {
 display: inline;}

 #lfbutt_a {
 padding-top: 4px;
 padding-left: 14px;
 background-image: url("images/web/hrmenu/a_alf.png");}

 #ctbutt_a {
 padding-left: 2px;
 padding-right: 2px;
 padding-top: 4px;
 background-image: url("images/web/hrmenu/a_act.png");}
 
 #rgbutt_a {
 padding-top: 4px; 
 padding-right: 14px;
 background-image: url("images/web/hrmenu/a_arg.png");}  

 .odka {
 text-decoration: none;
 font-size: 15px;
 color: #03eaff;
 font-style: italic;}
 
  .odkp {
 text-decoration: none;
 font-size: 15px;
 color: #ffffff;
 font-style: italic;}

 #lfbutt_b {
 margin-left: -2px;
 padding-left: 14px;
 padding-top: 4px;
 background-image: url("images/web/hrmenu/b_blf.png");}
 
 #ctbutt_b {
 padding-left: 2px;
 padding-right: 2px;
 padding-top: 4px;
 background-image: url("images/web/hrmenu/b_bct.png");}
 
 #rgbutt_b {
 padding-top: 4px;
 padding-right: 14px;
 background-image: url("images/web/hrmenu/b_brg.png");}
panther
Profil
alex:
1. vyhazej ty LI, nemaji tam co delat a nahrad je jinymi element, treba spany (nebo <i>, bude to kratsi).
2. jednotlive hovery pak budou vypadat takto (pro tento tvuj kod v nich misto SPAN bude LI)
#hrmenu a:hover span {}
#hrmenu a:hover span span {}
#hrmenu a:hover span span span {}
margin
Profil *
alex:
Děláš to komplikovaně, koukni do kódu na http://teststranek.kvalitne.cz/menu7.2/

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: