Pomocy, bo brakuje mi już pomysłów...
Czy mógłby mi ktoś przygotować same divy z szerokościami i wysokościami, abym uzyskał efekt jak na obrazku?
Google Maps wymaga height i width na 100%. Ja potrzebuję taką ramkę wyskalować do pewnego rozmiaru.
Co bym nie robił, to div4 z mapą wyjeżdża mi poza div3.
Jak prawidłowo powinno się ustawić na skalowanie te divy?
Konstrukcja to:
body
div-logo
div-menu
div1 zawiera div2 i div3
div3 zawiera div4 i div5
Zależy mi na tym elemencie od div1 do div5
Wrzuć kod na jakiś CodePen albo JSFiddle czy coś takiego - będzie prościej.
Grafikę olej, tylko kod i te divy (nie kumam div3 i 5, co to ma być? linię chyba zjadłeś).
Kurcze, ciężkawo to idzie - bootstrap, jquery i masa styli....
Jak można to prosto do jsfiddela wyrzucić?
Może floatami?
http://jsfiddle.net/n10jp5a1/
Zależy od designu, ale pewnie nawet chujowy overflow można pominąć i będzie cudownie :D :*
A tu display: inline-block (IMHO najlepsze wyjście, zobacz co się w HTML stało i o nic nie pytaj, można to zrobić inaczej, ale nie chcesz wiedzieć jak ;)):
Bez div3 też się da:
[edit]
A jak Boostrap to dlaczego nie atakować tego gridem? Musi być bite 40/60%? http://getbootstrap.com/examples/grid/
Dobra, mam:
http://jsfiddle.net/DTcHh/1474/
I teraz potrzebuję tak:
1) Mapa po lewej w obrębie panelu
2) wypunktowania po prawej w obrębie panelu
3) zoomowanie ekranu powinno jedynie wpływać na zakres wyświetlania, a nie wyjeżdżać poza panel mapą i wypunktowaniem
Pomożecie? :)
Edit:
b212 ==> Docelowo to się okaże, czy to będzie 75/25, czy 50/50 czy 33,33/66,66 :) Potrzebuję podziału skalowalnego w obrębie tego wiersza
Jak jutro będę miał chwilę to to sprawdzę, na razie dawka patrzenia na kod dziś została przekroczona. G'night.
Na szybko, bo znowu mnie przygniotły obowiązki i jeszcze w domu kończę pracę, także...
Dziwnie to jest napisane szczerze powiem. Od tego jest css framework z gridem, żeby to było napisane jakoś z głową i prościej.
Bazując na Twoim pierwszym "rysunku" to tak:
- panel zostawiasz jako panel, ewentualnie zamykasz odgórnie to w "row" a tego w "container";
- div2 masz z głowy bo to część panelu;
- poniżej masz kolejny "row", na którego składa się "col-lg-5" i "col-lg-7" (proporcje bootstrapowe, jak chcesz mieć bite 40/60 czy inne to musisz nadpisać col-* bootstrapa w swoim css).
Z rys. wynika, że div3=div5, nadal nie rozumiem Twojego stylu rysowania.
Nic nie powinno nigdzie wyjeżdżać, nachodzić i uciekać, nie ma szans jak zamkniesz całość w row a tego w container. Po to jest grid wymyślony.
Jak Ci się nie pali a w weekend będzie lało i strasznie się będę nudzić to jeszcze tu zajrzę, ale obiecać niczego nie mogę. Pzdr
http://jsfiddle.net/DTcHh/1480/ (następnym razem zrób forka, bo teraz każdy zainteresowany tym co znalazłeś do bootstrapa, zobaczy Twoje dzieło :P)
Sry legrooch, wczoraj też poległem. Nadal nie jestem pewien czy w [12] jest to czego szukasz, ogarnąłeś się już z tym?
Tuminure ==> Mistrzu - buziaki, dzięki wielkie itp :)
O to mi właśnie chodziło :)
Skalowalność + ten podział + obsługa panelu :)
Po trzystokroć dziękuję bardzo :)
Nie da się klasycznie, może jakimiś media queries. Albo javascriptem.
Dobra, a da radę ustawić mapę w %?
Kontener nie posiada stałej wysokości (czyt. rozszerza się, gdy wprowadza się do niego cokolwiek), dlatego też umieszczona w nim mapa nie może brać wysokości tego kontenera.
Ustalając wysokość kontenera, jednocześnie pozwolisz na ustalenie wartości procentowej mapy.
Przykład: http://jsfiddle.net/DTcHh/1487/
