Samo rozciągające się divy, Wstawiane obok siebie Opcje

[Tho]

Chcę by były wstawiane automatycznie, oboksiebie(dopłuki nie przekroczy ich łączna szerokość 900 px) i by same się rozciągały wprost proporcjonalnie do tekstu wewnątrz nich.

Jak np tutaj, takie kolumny, tylko więcej i nie na określony z góry rozmiar a samo rozciągające. Wiem że bardzo łatwo można załatwić to przez table, ale czy to będzie poprawne?

[erix]

Semantycznie nie, ale przez CSS możesz nadać wyświetlanie tabelkowe elementom.

[Tho]

Ale właśnie, jak to zrobić bez zbędnego bałaganu w kodzie?

[Sephirus]

Jeżeli chodzi Ci o to by te dwa bloki po prostu miały zawsze tą samą wysokość równą sobie niezależnie od tego w którym content jest dłuższy to można zrobić taki trick w css.

Przykład:

[HTML] pobierz, plaintext 
<div style="overflow:hidden;">
	<div style="width:500px; float:left; padding-bottom:10000px; margin-bottom:-10000px">
	...
	</div>
	<div style="width:300px; float:left; padding-bottom:10000px; margin-bottom:-10000px">
	...
	</div>
</div>
[HTML] pobierz, plaintext 

Kontener, w którym są kolumny musi mieć overflow na hidden żeby nie pokazywał nie potrzebnie tych 10K pikseli ;P I na czym to polega? Proste dajesz kolumnom padding dolny na 10K pikseli więc je o tyle przedłużasz, potem dajesz im margin dolny na tyle samo na minusie. Są dłuższe ale padding i margin się nawzajem znoszą i kontener wtedy ustala swoją wysokość na wysokość najdłuższej kolumny. A że te paddingi w kolumnach je przedłużają wygląda to tak jakby zawsze miały tą samo wysokość niezależnie od tego, która jest dłuższa i ile ich jest (IMG:style_emoticons/default/wink.gif)

HTH! (IMG:style_emoticons/default/wink.gif)

[kilab]

Tak z ciekawości zapytam. A jeśli wysokość strony przekroczyłaby 10k px? Profilaktycznie ustawić na 30k px lub więcej?

[!*!]

Nie. Kolega Sephirus uczy złych nawyków których nie powinno się nigdy stosować. A efekt można uzyskać tak http://jsfiddle.net/Q48Bv/

[Sephirus]

@up Może i uczę złych nawyków ale fakt faktem one działają (IMG:style_emoticons/default/wink.gif) I nie trzeba do tego używać HTML5 bo nie każdy go jeszcze używa - poza tym zmiana typu wyświetlania elementu na "tabelkowy" też chyba super nawykiem nie jest (IMG:style_emoticons/default/wink.gif)

Ten post edytował Sephirus 27.08.2011, 14:34:26

[!*!]

I nie trzeba do tego używać HTML5 bo nie każdy go jeszcze używa

To niech zacznie (IMG:style_emoticons/default/wink.gif) poza tym nie pisałem, że trzeba użyć html5, podałem link z przykładem bo sam w nim pracuje i nie widzę problemu ,aby zamienić to na div jak już tak bardzo ktoś jest antyhtml5. http://jsfiddle.net/Q48Bv/1/

poza tym zmiana typu wyświetlania elementu na "tabelkowy" też chyba super nawykiem nie jest (IMG:style_emoticons/default/wink.gif)

Dlaczego? Niby od czego one są? Mylisz pojęcia i masz dziwne skłonności z cyklu "tabela, imitujące tabele == fe". Jak chcesz wyświetlić dane tabelaryczne to też nie użyjesz tabel bo kiedyś słyszałeś że są one "fe" odnośnie budowy szablonu i przełożyłeś to na wszytko? (IMG:style_emoticons/default/biggrin.gif)

Ten post edytował !*! 27.08.2011, 17:39:40

[Sephirus]

Przede wszystkim - jeżeli choć troszkę w tym siedzisz to wiesz doskonale co to jest chociażby otarcie o kompatybilność przeglądarek na różnych systemach itd... to powinieneś wiedzieć, że chciał-nie chciał są jeszcze ludzie na tej planecie, którzy używają przeglądarek, w których zmiana display na jakiś element tabelkowy po prostu nie działa... Nie jestem przeciwnikiem tabelek i doskonale wiem o co Ci chodzi z tym ich nie lubieniem (IMG:style_emoticons/default/smile.gif) Jeżeli robisz coś dla siebie lub pracujesz w firmie , w której non-stop klepie się to samo lub po prostu idziesz za każdą nowością jaka się pojawi w dziedzinie HTML i masz w nosie "starych użytkowników" na których można zarobić to w twoja sprawa (IMG:style_emoticons/default/smile.gif) Niestety w realnym świecie jak się samemu projektuje i wykonuje się w firmie projekty na cały świat zarabiające jakąś normalną kasę to - wierz mi - liczy się to by temu 0,00001% użytkownikom, którzy używają np. IE 6 czy 7 (to nie mit - tego się jeszcze używa) dać szanse w pełni skorzystać z tego co robimy bo mamy z tego kasę (IMG:style_emoticons/default/smile.gif)

Tak w ogóle to postaraj się też w życiu kierować jakimiś zasadami (IMG:style_emoticons/default/smile.gif) skoro nie masz swoich przestrzegaj tych z forum (IMG:style_emoticons/default/wink.gif) I szanuj wszystkich jego użytkowników. Bo twój arogancki ton (choćbyś był ode mnie 20 lat starszy w co baardzo wątpie) wskazuje na narcyza w wieku 15 lat (IMG:style_emoticons/default/wink.gif)

Musisz też zrozumieć to, że jak ktoś w tym siedzi naprawdę długo to ma też nawyki związane z używaniem metod/haczyków/tricków, które kiedyś były konieczne aby wszystko zawsze i wszędzie wyglądało i działało tak samo ;P

P.S. Przedstawiona przeze mnie metoda nie jest oczywiście wymyślona przeze mnie (IMG:style_emoticons/default/smile.gif) Wymyślił i opisał ją ktoś, kto zna się na tym 100 razy lepiej od nas obu razem wziętych - może z nim podyskutujesz (IMG:style_emoticons/default/wink.gif) zapytaj wujka Google (IMG:style_emoticons/default/smile.gif)

Pozdrawiam (IMG:style_emoticons/default/smile.gif)

[Rid]

I tutaj Sephirus ma rację -tylko najnowsze przeglądarki poprawnie obsługują HTML5 np.IE9 czy firefox od 4.0 wzwyż, ie8 i ,firefox 3.5 już nie.
Nie każdy ma ochotę instalować nowsze przeglądarki ze względu na przyzwyczajenia lub na wymagania sprzętowe-niektórzy po prostu mają słabsze komputery i używają starsze przeglądarki-czy takie osoby należy olewać(IMG:style_emoticons/default/questionmark.gif) ?Sądzę, że nie.
Poza tym,rzesze ludzi korzysta z telefonów komórkowych,do przeglądania stron a nie wszystkie telefony wspierają tą technologię,tak więc też pooglądane.

Ten post edytował Rid 27.08.2011, 23:56:10

[!*!]

Jeśli już wspierałbym przeglądarki które tego nie obsługują, w tym wypadku IE6 i IE7 to użyłbym dla nich expressions, W porównaniu do Twojej metody, exp. jest nieinwazyjne i również można zapisać je w css. A na necie jest kilka przykładów z ich wykorzystaniem. pierwszy lepszy

Nie ma znaczenia CZY używasz metod/haczyków/tricków tylko JAK ich używasz i czy nie są one inwazyjne.

Rid - przeczytaj jeszcze raz co zostało napisane w tym temacie, a później porównaj to z tym co napisałeś.

Ten post edytował !*! 28.08.2011, 11:40:11

[Sephirus]

OK tu się z Tobą w pełni zgadzam - to jest najlepsze chyba rozwiązanie. Co do inwazyjności to zależy od konkretnego rozwiązania aplikacji, w której jakiś pomysł ma być użyty. Ludzie na forum pytają o coś, szukają pomocy ale w 99,9% przypadków nie wiesz naprawdę do czego im to i jak mają zamiar to zastosować. "Pomocni" dzielą się swoją wiedzą, pokazują różne opcje rozwiązania danego problemu. Ja podałem A, Ty podałeś B itd.. itp.. to już do tego co pytał należy wybór optymalnej dla jego potrzeb opcji - nie podoba mi się jedynie czasem ton niektórych wypowiedzi okazujący coś nietaktownego dla kogoś kto próbuje komuś jednak pomóc :/

Wydaje mi się, że to kończy temat (IMG:style_emoticons/default/wink.gif) !*! - respect (IMG:style_emoticons/default/wink.gif)