Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
*smoky*
Člen
Avatar
*smoky*:24.1.2015 8:20

Na monitoru mám dva obrázky vedle sebe, pod nimi čáru, ovšem když bude obrazovka malá a obrázky se budou prolínat, chtěl bych, aby se daly pod sebe a čára pod ně. Poradíte mi prosím, jak tohoto docílit?

Zatím kód mám takovýto:

<div style="position: absolute; width:100%;he­ight:15%">

<div style="position: relative; width:50%; float:left; height:50%; top:10%; margin: auto"><img src="obr1.png" height="130%" max-width= "70%"></div>
<div style="position: relative; float:right;wid­th:50%; height:50%; top:5%;"><img src="obr2.png" height="130%" max-width= "70%" style="float:right; margin-right:10%"></div>

</div>

<div style="position: absolute; width:99%;heig­ht:1%;top:15%;bac­kground-color:red;">

Odpovědět
24.1.2015 8:20
Pít, žít, umřít.
Avatar
Ori I
Člen
Avatar
Odpovídá na *smoky*
Ori I:24.1.2015 9:14

použi media query, alebo namiesto float, daj display:inline pre obe, a malo by to fungovať.

 
Nahoru Odpovědět
24.1.2015 9:14
Avatar
*smoky*
Člen
Avatar
*smoky*:25.1.2015 11:09

media quary nemůžu použít, nevím velikosti obrázků, divů ani obrazovky, takže by to byl složitý vzorec a nejspíš by se mi to často rozesypalo.
Za radu display:inline velmi děkuji, pouze se mi poté ztrácí modrá čára, i přes nastavení relativní pozice a display:inlinu.
Zkoušel jsem jí nastavit i jiné vlastnosti, případně dát předchozí divy do nadřazeného divu a těm nastavovat vlastnosti, nicméně stále to nejde. Pomůžeš mi prosím ještě s tímto?

Nahoru Odpovědět
25.1.2015 11:09
Pít, žít, umřít.
Avatar
Odpovídá na *smoky*
Josef Kuchař - Pepa489:25.1.2015 11:22

aby se ti ta čára zobrazovala, musíš vytvořit tag

<div class="clear"></div>

a potom do css dát

.clear { clear:both; }
;)
Nahoru Odpovědět
25.1.2015 11:22
2x piš, jednou debuguj
Avatar
*smoky*
Člen
Avatar
*smoky*:25.1.2015 12:03

Pepa489 vyčištění nepomáhá. K divu s čárou jsem musel dát pozici relativní, nemohu ji nechat napevno.

Nahoru Odpovědět
25.1.2015 12:03
Pít, žít, umřít.
Avatar
TomasGlawaty
Člen
Avatar
TomasGlawaty:25.1.2015 14:12

a co použít flexbox?
divu, který obaluje oba obrázky nastavit

display: -webkit-inline-box;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: -webkit-inline-flex;
display: inline-flex;

-webkit-flex-flow: row wrap;
flex-flow: row wrap;

já jsem to předtím použil např. tady: http://hummers.8u.cz/index.php?…

Editováno 25.1.2015 14:13
 
Nahoru Odpovědět
25.1.2015 14:12
Avatar
*smoky*
Člen
Avatar
Odpovídá na TomasGlawaty
*smoky*:25.1.2015 14:44

Panejo, takto nějak si to představuji, mockrát děkuju :-)

Nahoru Odpovědět
25.1.2015 14:44
Pít, žít, umřít.
Avatar
TomasGlawaty
Člen
Avatar
Odpovídá na *smoky*
TomasGlawaty:25.1.2015 15:13

Není zač :)

 
Nahoru Odpovědět
25.1.2015 15:13
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na TomasGlawaty
Tonda Kozák:25.1.2015 21:23

Víš o tom, že to nepodporuje ani IE 10?

 
Nahoru Odpovědět
25.1.2015 21:23
Avatar
TomasGlawaty
Člen
Avatar
Odpovídá na Tonda Kozák
TomasGlawaty:25.1.2015 22:16

Ano vím :)
přesněji, IE10 podporuje flexbox zapsaný starou syntaxí, ale nepodporuje vlastnost flex-flow, flex-wrap...

 
Nahoru Odpovědět
25.1.2015 22:16
Avatar
mkub
Tvůrce
Avatar
Odpovídá na Tonda Kozák
mkub:26.1.2015 3:50

IE nikdy nepodporoval novinky, cize to nie je nic noveho, ze MS zaostava to vo vsetkom, len blbne s blbym ovladanim svojho SW

 
Nahoru Odpovědět
26.1.2015 3:50
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na mkub
Tonda Kozák:26.1.2015 7:26

Nejde ani tak o to, jestli zaostává, nebo ne (mimochodem dělá jen opak toho, co mu bylo dříve vyčítáno - čeká na konečnou specifikaci), ale o to, že tím odstřihne velkou část uživatelů. Mám dojem, že IE 10 je posledním IE, který můžou mít uživatelé Windows 7.

*smoky*
Nevím, jestli jsem dobře pochopil, o co se snažíš, ale takhle to jde udělat funkční pro všechny:
http://kod.djpw.cz/wwjb

 
Nahoru Odpovědět
26.1.2015 7:26
Avatar
Odpovídá na mkub
Michal Žůrek - misaz:26.1.2015 15:55

Vnesme do tvého názoru trochu objektivity.

IE nikdy nepodporoval novinky - IE novinky podporuje, ale pomalu a pozdě.

MS zaostava to vo vsetkom - ne nezaostává. Jen Linuxáci to tak vidí.

len blbne s blbym ovladanim svojho SW - obávám se, že se jádro znatelně mění, jen to nikdo nevidí a vlastně v podstatě většinu koncových zákazníků ani nezajímá, proto o tom tolik nemluví.

Každopádně když už chceš remcat jak jsou produkty MS na ho*no, tak by ses měl podívat proč takové jsou. Ten standart se vyvíjel, tehdy se nazýval Grid layout a ten i microsft implementoval do IE (nejspíš proto aby při uvádějí WinJS byla stejná možnost tvorby layoutů jako v C#). Pak někoho hodně chytrého napadlo, že by ten standart mohl být úplně stejný, ale mohli by ho přejmenovat (dodnes nechápu ten důvod, proč to přejmenovali, možná jenom mají rádi zmatek) na flexbox. Tím samozřejmě přejmenovali i všechny CSS vlastnosti, nicméně jen těžko můžeš přejmenovat něco v produktu, který je nasazen hlavně ve firmách, kde na něm běží přímo optimalizované weby (většinou různé intranety). Za žádnou cenu však nelze říct, že IE nepodporuje flexbox, podporuje, ale jmenuje se to jinak.

 
Nahoru Odpovědět
26.1.2015 15:55
Avatar
mkub
Tvůrce
Avatar
Odpovídá na Michal Žůrek - misaz
mkub:26.1.2015 23:07

v MS mas pravdu, novinky v specifikacii HTML pridava uplne ako posledny, kedto uz vsetci ostatni uz davno podporuju,
co sa tyka dalsich noviniek, to, co je pre uzivatelov MS softu nove, na poli Unixu je to uz zauzivane uz cele roky a mohol by som aj uviest zopar prikladov z historie, napr. o multiuseringu a multitaskingu si MS mohol este zdat, ked Unix tieto vlastnosti uz standardne ponukal, vlastne bol odzakladu stavany akoviacuzivatelsky a viaculohovy OS
a co sa tyka SWAPu? takisto to je technologia zhruba zo 60-tych, ci 70-tych rokov a bol pouzity v minipocitacoch a v tom obdobi kde bol MS? MS vtedy bolamalinka firma 1, ci 2 muzov a nemali este ziadny OS, jedine mali Basic pre Altair

 
Nahoru Odpovědět
26.1.2015 23:07
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 14 zpráv z 14.