Avatar
petericek
Člen
Avatar
petericek:

Zdravím, vytvoril som si na stránke 4 tlačidlá, cez ktoré sa chcem prekliknúť.

Problém je v tom, že Internet Explorer, síce zobrazí použitie hover, nepreklikne; Mozila nezobrazí použitie hover, nepreklikne; kým Opera a Chrome sa správajú korektne, zobrazia najazd myšky na tlačidlo a prekliknú sa kam chcem. Prosím o radu.

Zdroják prikladám.

html:
<section class="tlacidla">

<button class="tlacidlo">Pred­metové súťaže</button>
<button class="tlacidlo">Špor­tové súťaže</button>
<button class="tlacidlo">U­melecké súťaže</button>
<button class="tlacidlo">O­lympiády</but­ton>
</section>

css:
.tlacidlo { display: block; margin-left: 10px; float: left; text-align: center; font-size: 16px; color: white; background: blue; height:40px; border-radius: 15px; }
.tlacidlo a { text-align: center; font-size: 16px; color: white; background: blue; height:40px; border-radius: 15px; text-decoration: none; }
.tlacidlo a:hover { text-align: center; font-size: 16px; color: red; background: blue; height:40px; border-radius: 15px; text-decoration: none; }
.tlacidla { float: left; width: 610px; margin-left: 10px; margin-top: 0px; margin: 15px;}

 
Odpovědět 17.6.2015 14:35
Avatar
petericek
Člen
Avatar
petericek:

Ukážka na našej školskej stránke, momentálne pripravujem novú verziu, len tá časť, čo nefunguje:

http://www.zsobchodsec.edu.sk/…uspechy.html

Vďaka za odpovede

 
Nahoru Odpovědět 17.6.2015 15:02
Avatar
adder
Člen
Avatar
Odpovídá na petericek
adder:

Ahoj,

nejsem si úplně jist, jak se chová odkaz v

<button>

, ale jsem si jist, že to není dobře. Tag

<button>

se používáš ve formulářích, přesměrování na jinou stránku přes odkaz - tag

<a>

.

Také jsem si všiml, že máš 2x definované stejné styly, stačí jednou.

Když použiješ

float: left;

, tak už nemusíš psát

display: block;

- float to zařídí.

Jako opravené řešení lze použít tohle: http://jsfiddle.net/2gehufxa/1/

Nahoru Odpovědět  ±0 17.6.2015 21:50
I’m going to lay this brick as perfectly as a brick can be laid.
Avatar
petericek
Člen
Avatar
Odpovídá na petericek
petericek:

Problém vyriešený, použitá metóda <form method="post" action="xxx.html"><in­put value="XXX" name="submit" class="submit" type="submit"></for­m>, funguje aj hover v IE, O, MF, GCH

 
Nahoru Odpovědět  -1 17.6.2015 21:51
Avatar
petericek
Člen
Avatar
Odpovídá na adder
petericek:

Vďaka za odpoveď, tvoje riešenie vyzerá inteligentnejšie ako moje ...

 
Nahoru Odpovědět 17.6.2015 21:57
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 5 zpráv z 5.