PDA

Zobacz pełną wersję : Problem z jednakowym skalowaniem DIV



Jacek_C
21-12-2016, 14:43
Witam,

mam problem ze skalowaniem tabel.
Mam strone a na niej mam trzy tabelki po dwa elementy DIV obok siebie. (sa to trzy tabelki o polach tej samej klasy) o strukturze jak ponizej.

DIV1 DIV2 (tabelka 1)

DIV1 DIV2 (tabelka 2)

DIV1 DIV2 (tabelka 3)

W DIV1 wyswietlam obrazek, DIV2 wystwietlam text.

Przy duzej szerokosci strony wszystko wyswiela sie poprawnie.
Po zmniejszeniu szerokosci strony element DIV1 jest skalowany dla kazdej tabelki inaczej.
Obrazek w tabeli 1 jest mniejszy niz w tabeli 2. W tabeli 3 obrazej jest sredniej wielkosci.

Wszystkie DIV1 sa tej samej klasy, w kazdym jest wyswietlany ten sam plik graficzny.

Jak zdefiniowac css dla DIV1 aby wszystkie pliki graficzne byly wyswietlane tej samej wielkosci.

z gory dziekuje za pomoc

zwiastun
21-12-2016, 18:30
Nie używać tabel do osadzania na stronie obrazków. To technika przedpotopowa, jeszcze z dziecięcych lat internetu.

Jacek_C
21-12-2016, 18:56
Nie używać tabel do osadzania na stronie obrazków. To technika przedpotopowa, jeszcze z dziecięcych lat internetu.

alez ja napisalem ze uzywam DIV, a nie tabela.... przeciez tabele nie daja sie skalowac...

pokazalem ze umiescilem elementy DIV uzyskujac efekt tabeli... i mam problem z jednakowym i rownoczesnym skalowaniem "pierwszych kolumn" elementow DIV, bo chociaz zawieraja ten sam plik graficzny to zmniejsza sie ta kolumna w roznych proporcjach. W kolumnach DIV2 sa umieszczone rozne teksty i stad bierze sie ten problem, ale nie potrafie "wymusic" jednakowego skalowania elementow DIV1, tak aby po zwezeniu (np. na urzadzenia mobilne) grafika byla tej samej wielkosci (przeskalowana) a jedynie teksty umieszczone w elementach DIV2 zawijaly sie.

Bazyl
21-12-2016, 22:02
mam trzy tabelki po dwa elementy DIV obok siebie. (sa to trzy tabelki o polach tej samej klasy)

Skoro już wiadomo, że tabelki to nie tabelki - podaj linka do podstrony z kodem...

mjmartino
23-12-2016, 17:47
<div class="row">
<div class="col-xs-6 col-md-6">
</div>
<div class="col-xs-6 col-md-6">
</div>
</div>
Podział 50% na 50%
xs (telefony), sm (tablety), md (PC), and lg (szerokie monitory)
O ile używasz bootstrapa 3
Chyba że chodzi ci o to że img rozwala Ci tabele i nie jest respo wówczas max-width: 100%; rozwiąże sprawę