[CSS] Wyśrodkowanie w pionie Opcje

[o2w5n778]

Witam!
Czy poprawnie jest używać parametru line-height do wyśrodkowywania tekstu w pionie?

[b4x]

@o2w5n778 - niby możesz... ale lepiej wygląda np.

[HTML] pobierz, plaintext 
<style>
#top {display: table;}
 
#srodek {
    display: table-cell;
    vertical-align: middle;
}
</style>
<div id="top">
    <div id="srodek">
        Cos ...
    </div>
    test<br />
    test
</div>
[HTML] pobierz, plaintext 

[cykcykacz]

Hm... jak dlamnie jeśli wygląda poprawnie w kilku przeglądarkach np: internt ex, itd.

To czemu nie.

[Arcioch]

Hej (IMG:style_emoticons/default/smile.gif) line-height nie służy do wyśrodkowania tekstu w pionie tylko do odstępu pomiędzy liniami (IMG:style_emoticons/default/smile.gif)

Zobacz tu masz wyjaśnione jak to zrobić (IMG:style_emoticons/default/smile.gif) LINK

[o2w5n778]

Hej (IMG:style_emoticons/default/smile.gif) line-height nie służy do wyśrodkowania tekstu w pionie tylko do odstępu pomiędzy liniami (IMG:style_emoticons/default/smile.gif)

Zobacz tu masz wyjaśnione jak to zrobić (IMG:style_emoticons/default/smile.gif) LINK

Nie chce działać z float: left

[HTML] pobierz, plaintext 
#headerText {
    width: 300px;
    height: 150px;
    display: table-cell;
    vertical-align: middle;
    float: left;
}
[HTML] pobierz, plaintext 

[!*!]

I tak ma być, float Ci tu nie potrzebne. Elementowi który jest ma być obok, nadaj też wartość display:table-cell/row.

Ten post edytował !*! 23.04.2013, 14:28:36

[memory]

Tabelki nadal w cenie (IMG:style_emoticons/default/smile.gif)

[!*!]

Tabelki nadal w cenie (IMG:style_emoticons/default/smile.gif)

A gdzie Ty tu tabele widzisz?

[Dejmien_85]

Tabelki nadal w cenie (IMG:style_emoticons/default/smile.gif)

Do wyświetlania dużej liczby danych (w tabelach) tak, jednak na pewno nie do layoutu strony. ; )

Wracając do tematu, line-height (jak sama nazwa mówi), to wysokość linii. Jeśli będziesz miał jedną linię tekstu, wtedy możesz ją niby wyśrodkować, bo wysokość linii w danym tekście się podniesie i przez to tekst opadnie. Jednak jeśli będziesz miał więcej linii tekstu, wtedy... będzie to "nieciekawie" wyglądać. Polecam zapoznanie się z "vertical-align" (tak jak to ktoś wyżej wskazywał). ; )

Ten post edytował Dejmien_85 23.04.2013, 16:22:11