NOVINKA! E-learningové kurzy umělé inteligence. Nyní AI za nejlepší ceny. Zjisti více:
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!
Avatar
wolfsharp666
Člen
Avatar
wolfsharp666:4.5.2016 22:07

Zdravím narazil jsem na problém dělám webové stránky a když se do tagu <section> snažím rozdělit 2 věci vedle sebe pomocí Divu tak tag section to bere jak bych do něho nic nevložil a neroztahuje se podle rozložení obsahu a rozhazuje celé formátování stránky a to hlavně na mobilu. Děkuji za jakoukoliv radu.

article section.clanek{
  position: relative;
    width: 100%;
    height: 50%;
    background: #ccc;
    margin-top: 7%;
 }

 div.pr1{
  position: relative;
  width: 45%;
  float: left;
  margin: 1%;
 }
 div.pr2{
  position: relative;
  width: 45%;
  float: right;
  margin: 1%;
 }
<article>
<section class="clanek">
    <h2>Cena a další design na vyžádání </h2>  <br>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek.jpg"></a></div>
        <div class="pr2"><a href="css/obraz/produkty/vnitrek2.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek2.jpg"></a></div>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek3.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek3.jpg"></a></div>
        <div class="pr2"><a href="css/produkty/vnitrek4.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek4.jpg"></a></div>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek5.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek5.jpg"></a></div>
        <div class="pr2"><a href="css/obraz/produkty/vnitrek6.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek6.jpg"></a></div>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek7.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek7.jpg"></a></div>
        <div class="pr2"><a href="css/obraz/produkty/vnitrek8.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek8.jpg"></a></div>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek9.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek9.jpg"></a></div>
        <div class="pr2"><a href="css/obraz/produkty/vnitrek10.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek10.jpg"></a></div>
        <div class="pr1"><a href="css/obraz/produkty/vnitrek11.jpg" data-lightbox="vnitrek"><img width="100%" src="css/obraz/produkty/vnitrek11.jpg"></a></div>

</section>
</article>
 
Odpovědět
4.5.2016 22:07
Avatar
Tomáš123
Člen
Avatar
Odpovídá na wolfsharp666
Tomáš123:5.5.2016 13:25

Obtekané prvky sú vyňaté z toku dokumentu. Zabrániť sa tomu dá clearovaním. Viď http://www.jakpsatweb.cz/css/clear.html.

Nahoru Odpovědět
5.5.2016 13:25
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Libor Šimo (libcosenior)
Tvůrce
Avatar
Odpovídá na wolfsharp666
Libor Šimo (libcosenior):5.5.2016 14:02

Máš dobre nalinkovaný css súbor?
Mne to myslím kreslí dobre.

Nahoru Odpovědět
5.5.2016 14:02
Aj tisícmíľová cesta musí začať jednoduchým krokom.
Avatar
Tomáš123
Člen
Avatar
Tomáš123:5.5.2016 14:47

Rodič sa nerozťahuje aj kvôli obmedzeniu výšky. Prečnievajúci obsah sa správa podľa nastavenej hodnoty vlastnosti overflow (predvolene visible - obsah je viditeľný, vytečie z rodiča).

Bude teda potrebné odstrániť nastavenie výšky a pridať nejaký čistič (spomínaná vlastnosť clear).

Akceptované řešení
+20 Zkušeností
+2,50 Kč
Řešení problému
Nahoru Odpovědět
5.5.2016 14:47
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
wolfsharp666
Člen
Avatar
wolfsharp666:10.5.2016 12:25

Děkuji za pomoc :)

 
Nahoru Odpovědět
10.5.2016 12:25
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 5 zpráv z 5.