eGospodarka.pl
eGospodarka.pl poleca

eGospodarka.plGrupypl.comp.wwwCSS - środkowanie w pionieRe: CSS - środkowanie w pionie
  • Path: news-archive.icm.edu.pl!news.icm.edu.pl!.POSTED!not-for-mail
    From: Marek <p...@s...com>
    Newsgroups: pl.comp.www
    Subject: Re: CSS - środkowanie w pionie
    Date: Fri, 30 Dec 2011 00:34:43 +0100
    Organization: ICM, Uniwersytet Warszawski
    Lines: 106
    Message-ID: <1wckuuejo82o3$.1djowkk1lom0j$.dlg@40tude.net>
    References: <1l97ww8evns6$.19skeqvtexd8v$.dlg@40tude.net>
    <4...@z...googlegroups.com>
    <1sqw2529mjhzp$.iuq5v4dj29mb$.dlg@40tude.net>
    <c...@p...googlegroups.com>
    <1...@4...net>
    <8...@q...googlegroups.com>
    <15h3k1j644yig.1ewaatpl81nw2$.dlg@40tude.net>
    <b...@z...googlegroups.com>
    <11017g3vi9zms.1gyqdj29f8tr3$.dlg@40tude.net>
    <0...@m...googlegroups.com>
    <11bdfjln06zve$.1kp897szd7ph9$.dlg@40tude.net>
    <3...@j...googlegroups.com>
    NNTP-Posting-Host: 89-77-242-221.dynamic.chello.pl
    Mime-Version: 1.0
    Content-Type: text/plain; charset="utf-8"
    Content-Transfer-Encoding: 8bit
    X-Trace: news.icm.edu.pl 1325201694 8346 89.77.242.221 (29 Dec 2011 23:34:54 GMT)
    X-Complaints-To: u...@n...icm.edu.pl
    NNTP-Posting-Date: Thu, 29 Dec 2011 23:34:54 +0000 (UTC)
    User-Agent: 40tude_Dialog/2.0.15.41pl
    Xref: news-archive.icm.edu.pl pl.comp.www:400074
    [ ukryj nagłówki ]

    Dnia Thu, 29 Dec 2011 12:27:43 -0800 (PST), HARY napisał(a):

    > Można się najwyżej zastanawiać, dlaczego później, kiedy CSS zaczął być
    > wreszcie sensownie wspierany, nie poszerzono specyfikacji.

    No więc właśnie. CSS3 zdecydowanie żegna się z pierwotnym postrzeganiem
    celu dla jakiego powstał HTML. CSS2 też ma już sporo atrybutów służących
    budowaniu interaktywnych "aplikacji" zamiast zaledwie strukturalnych
    dokumentów. Tak więc powoływanie się na zaszłości historyczne jest już
    przereklamowane.

    >
    > Zajrzyj do specyfikacji np. pod margin (punkt 8.3) i zobacz opis dla
    > wartości procentowych. Też się można zastanawiać, dlaczego tak
    > ustalono. Czasem aż się prosi o komentarz z uzasadnieniem...

    Czy ja dobrze wnioskuję, że procentowe marginesy górne i dolne zależą od
    szerokości????

    >> Czy nie możemy zastosować definicji centrowania
    >> z CSS dla text-align:center lecz przeniesionej na pion?
    >
    > Nie możemy. Ale jeśli uważasz inaczej, to proszę bardzo, podaj
    > dokładną definicję.

    No to właśnie poniżej cytujesz moją dokładną definicję :-)

    >> I o to mi chodziło właśnie.Skoro już ciągniemy tą kwestię to wygląda to
    >> tak, że jeśli tekst nie jest oblany blokiem to tworzy się wokół niego blok
    >> anonimowy, który następnie podlega centrowaniy pionowemu względem
    >> nadrzędnego table-cell. Tzn środki obu elementów pokrywają się.
    >
    > Jak wyżej: podaj dokładnie, gdzie są granice owego anonimowego bloku.
    > Wtedy będzie wiadomo, gdzie jest jego środek.

    Granice pionowe są takie jak granice przy poziomym dopasowaniu bloku do
    zawartości. Czyli ostatni piksel zawartości wyznacza je najprawdopodobniej.
    Nie zastanawiałem się nad tym, nie siedziałem z lupą przy monitorze tylko
    używałem. Tak jak benzynę do baku leję - nie myślę o tym jak kto wydobywał
    ropę, gdzie ją przetwarzano, jakie numery seryjne miał wagon transportujący
    ją, jak mierzy się oktany w niej zawarte i czy to co wlewam ma 95 oktanów a
    może 94.99? A jeśli ma 94.99 to czy dojadę na niej do celu tak samo szybko
    jak na 95? :-D Po co rozważać takie niuanse? Po co rozmyślać o pikselu
    jednym w tą czy w tamtą? Pewnie to ktoś już zdefiniował skoro centrowanie i
    w pionie i w poziomie JEST FAKTEM. Chyba nie zaprzeczysz, że w TD da się
    wycentrować się zawartość tekstową w pionie? Po co mam się zastanawiać jak
    jest ona zrealizowana na poziomie piksela skoro ktoś już to zaimplementował
    w przeglądarce a ja chcę jedynie w innym znaczniku niż TD też ją
    zastosować. Kompletnie nie rozumiem Twoich nacisków na to abym ja zgadywał
    definicję tego co producenci przeglądarek mają w wtytycznych i stosują od
    lat.

    >
    > Nie wiem, czy to "height:100%" jest potrzebne, wymyślam na bieżąco:
    >
    > <ul style="display:table;width:10em;">
    > <li style="display:table-row; height:4em;"><div style="display:table-
    > cell; height:100%">
    > <li ...
    >

    Ja to teraz realizuję:

    <div class="row">
    <div class="cell">tutaj mój tekst</div>
    </div>

    <div class="row">
    <div class="cell">tutaj mój tekst</div>
    </div>

    <div class="row">
    <div class="cell">tutaj mój tekst</div>
    </div>

    ....

    Gdzie:

    row {
    display: table-row;
    }

    .cell {
    display: table-cell;
    height: 50px;
    vertical-align: middle;
    }

    Klasa row używana jest jako wymuszenie bloku na elemencie z cell. Logika
    nakazuje, że blokiem może być zwykły DIV bez klasy. Jednakże zwykły div o
    narzuconej wysokości nie wiadomo dlaczego nie potrafi wycentrować swojej
    zawartości a DIV z table-cell - już tak, ale wtedy klei się jeden do
    drugiego w poziomie - czego nie chcę uzyskać.

    Dużo lepiej wyglądałby kod:

    <div>mój tekst</div>

    Gdzie:

    div {
    height:50px;
    vertical-align: middle;
    }

Podziel się

Poleć ten post znajomemu poleć

Wydrukuj ten post drukuj


Następne wpisy z tego wątku

Najnowsze wątki z tej grupy


Najnowsze wątki

Szukaj w grupach

Eksperci egospodarka.pl

1 1 1

Wpisz nazwę miasta, dla którego chcesz znaleźć jednostkę ZUS.

Wzory dokumentów

Bezpłatne wzory dokumentów i formularzy.
Wyszukaj i pobierz za darmo: