Diskuze: problém se stylování <a>

HTML a CSS HTML a CSS problém se stylování <a> American English version English version

Avatar
Honza Bittner
Redaktor
Avatar
Honza Bittner:

Ahoj, mám problém se stylováním <a>... http://prntscr.com/2nxtha

Potřebuji, aby byla výška 50px - to již je nastaveno přes line-height, ale jaksi nefunguje. Také ho potřebuji dostat na střed.

Všechno tak, aby bylo :hover použito jen na šířku textu, né na celý bílý pruh.

Odpovědět 30.1.2014 16:34
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Juraj Mlich
Redaktor
Avatar
Odpovídá na Honza Bittner
Juraj Mlich:
#selektor {
    display: block;
    height: 50px;
    margin: auto;
}
Editováno 30.1.2014 16:37
Nahoru Odpovědět 30.1.2014 16:36
Vždy je lepšie učiť sa z cudzích chýb, než z vlastných chýb.
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

pokud text-align nefunguje, tak bych mu nastavil

display: block;
height: 50px;
width: co potřebuješ px;
margin: 0 auto;

nevím jestli toto bude fungovat.

Nahoru Odpovědět  +1 30.1.2014 16:38
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Juraj Mlich
Honza Bittner:

To sice ano, ale pak bude :hover efekt na celém bílém bloku, což nechci.

Nahoru Odpovědět 30.1.2014 16:40
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

Width bych potřeboval nejlépe automaticky, toho se dá docílit případně přes text-align:center na bílém pruhu... Zbývá ještě dořešit výška, což se divně zarovnává jen kolem písma.

Nahoru Odpovědět 30.1.2014 16:42
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

tak obsah zanoř do span a dej hover efekt na ten.

Nahoru Odpovědět 30.1.2014 16:43
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

<a> dělá vždy problémy prostě ...

Nechci ho obalovat... :P

Nakonec mě napadlo vyzkoušet display: inline-block; a funguje, společně s text-align na rodičovském elementu.

Nahoru Odpovědět 30.1.2014 16:44
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

obalování je prasárna, myslel spíš zanoření:

<a><span></span></a>
Nahoru Odpovědět 30.1.2014 16:46
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

To by pořád nevyřešilo můj problém s tím, že nechci mít klikatelný celý pruh... :)

Jak jsem psal tak mi to už funguje, takže ok... :D

Nahoru Odpovědět 30.1.2014 16:52
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
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 9 zpráv z 9.