2013-01-21 16 views
6

Mam element div zawierający obraz i tekst. Jeśli tekst zajmuje tylko jedną linię, chcę, aby tekst był wyrównany w pionie do środka obrazu. Jeśli tekst zajmuje więcej niż jeden wiersz tekstu, chcę, aby górna część tekstu była wyrównana do górnej krawędzi obrazu.CSS - Zastosuj inny styl, jeśli zawartość przepełni się do nowej linii

Czy CSS ma sposób wykrywania zawijania tekstu do następnej linii?

+0

Nie, css nie może wykryć takich rzeczy. to tylko język stylizacji i nie ma możliwości podejmowania decyzji. –

+0

@SvenBieder Dziękuję. To jest to co myślałam. Czy możesz opublikować odpowiedź, aby zaakceptować ją jako odpowiedź. – Jon

+0

Jeśli używasz jQuery, możesz liczyć długość tekstu i określić warunek dotyczący klasy. if ($ ('yourdiv'). text(). length <100) {$ (this) .addClass ("small")} else {....} –

Odpowiedz

5

Nie, CSS nie może wykryć takich rzeczy. Jest to tylko język stylizacji i nie ma możliwości podejmowania decyzji.

+2

, podczas gdy jest to właściwe dla pojedynczego/wielu linii, CSS może dokonać desicions. Zapytania o media i ': empty' są dobrymi przykładami podejmowania decyzji przez CSS o tym, co dzieje się w przeglądarce. Zasadniczo każda pseudo-klasa to decyzje CSS. Znajdź listę pseudo-klas tutaj: https://developer.mozilla.org/de/docs/Web/CSS/Pseudo-classes Mam nadzieję, że dodadzą pseudoklasy typu ': single-line' lub' : text-wrap' sometime. – ProblemsOfSumit

2

Nie, nie jest to możliwe. Możliwe jest jednak zapobieganie "zawijaniu" słów lub przechodzeniu do następnej linii. chociaż ta funkcja nie jest w pełni obsługiwana przez wszystkie przeglądarki. Nazywa się to word-wrap.

+0

Potrzebuję tekst do zawijania, ale dziękuję za dostarczenie alternatywnego rozwiązania. – Jon

Powiązane problemy