GoldenLine
Zaloguj się

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Jestem w trakcie tworzenia strony, i moim pytaniem jest to w jaki sposób zrobić aby dwa sąsiednie divy rozciągały się pod wpływem treści razem, czyli że jak do Diva "Treść" wpisze dużo tekstu i mi się rozciągnie to żeby Div "Menu" też się tak rozciągną. Poniżej zamieszczam adres mojej nie ukończonej stronki. Liczę na wskazówki.

http://czyzew.it.cx/~jazwinskid
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

http://jsfiddle.net/LCTUc/ ( http://caniuse.com/#search=table )Rafał Krupiński edytował(a) ten post dnia 01.01.13 o godzinie 21:43
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

A jeśli chcesz by działało Ci w ie8 i mniejszych to użyj display: inline-block + zoom: 1

Poszukaj w sieci jak dokładnie się to pisze
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Z tych dwóch linków to mało zrozumiałem niestety, jeżeli była by taka możliwość to prosił bym o jakieś prostsze i całkowite wskazówki, chciałbym to zrobić, ale też i zrozumieć. Do którego elementu miałbym dodać te display: inline-block i w jaki sposób to miało by pomóc mi w tym żeby divy rozciągały się razem i o co chodzi z tym zoomem? Proszę o wyrozumiałość :)
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Oba linki mają Ci uświadomić, że powinieneś kazać warstwom treści i menu zachowywać się jak komórki w tabeli (tak jakby znacznik TD z html). Powoduje to, że obie warstwy stoją obok siebie (nie ma potrzeby używania float: left;) i mają elastyczny parametr długości co powoduje, ze dostosowują się do siebie.

Podobny efekt można osiągnąć display:inline-block; jak już wspomniano.Sebastian Zaborowski edytował(a) ten post dnia 02.01.13 o godzinie 17:44
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Czyli lepiej jak użyję display: inline-block? Zaraz poeksperymentuję i zobaczę co będzie.
No nic nie dało dodanie tego display do divów "treść" i "menu", chyba, że trzeba to jakoś inaczej użyć? Jeśli chodzi o te linki to jak mam to zastosować w mojej stronie, mam nadane identyfikatory do divów, nadać też klasy? Proszę o wytłumaczenie.Damian Jaźwiński edytował(a) ten post dnia 02.01.13 o godzinie 17:57
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Zobacz to:
http://jsfiddle.net/LCTUc/5/
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Sam musisz zdecydować czego użyjesz. Jedno i drugie jest dobre.

W podanych przez kolegów linkach masz kod jaki tam został użyty. To taki edytor online: html, css, JS klikasz RUN i patrzysz na efekty działania. Zastosuj to do swojego kodu i już.Sebastian Zaborowski edytował(a) ten post dnia 02.01.13 o godzinie 18:51
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Czy da się użyć i identyfikatora i klasy jednocześnie?
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Nic nie stoi na przeszkodzie.
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Ale jak ostylujesz po id'ku to Harry Roberts urwie Ci d@%ę :)
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

A tak prostszymi słowami? heh
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Klasy są po to, żebyś mógł ich użyć przy wielu elementach na stronie, jak użyjesz IDka to użyjesz tego stylu tylko raz.
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Kombinuję i nic, zrobiłem tak jak było w tym linku i żadnej reakcji, gdzie leży błąd?

http://czyzew.it.cx/~jazwinskid/

Dodałem te klasy i nie działa. Może występuje jakaś sprzeczność w arkuszu zewnętrznym?Damian Jaźwiński edytował(a) ten post dnia 02.01.13 o godzinie 19:33
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Jesteś pewien, ze nie działa? U mnie kolumna z menu jest po lewej stronie od treści.
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

No ale mi chodziło o to żeby div Treść rozciągał się razem z div'em Menu i odwrotnie no i tak sie nie dzieje a próbowałem już wszystkiego co mi radziliście, być może robiłem coś źle, ale raczej nie.
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

A mozesz dać jakiegoś printskrina jak Ty to widzisz, a jak chciałbyś by było?
Bo może coś źle rozumiem
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Ja to tak widzę, nie wiem czy jasno rozrysowałem ale starałem się


Obrazek
Link do wypowiedziLink
Piotr Danielewicz

Piotr Danielewicz front-end developer,
Media 4 U

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

A, w ten sposób? ;)
To jeśli nie będzie dodatkowych atrakcji tylko powiedzmy kolor, pattern to ja bym zrobił tak:

Zobacz czy takie coś Ci wystarczy:
http://jsfiddle.net/LCTUc/8/
Link do wypowiedziLink

konto usunięte

Temat: Elastyczność DIV'ów, połączone rozciąganie się.

Trik trika trikiem pogania.
IMHO Łatwiej napisać display: table-cell niż display: inline-block; zoom: 1; *display: inline;
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

[CSS] rozciąganie div




Wyślij zaproszenie do
Anuluj