Dwa divy w jednej linii: Różnice pomiędzy wersjami
Przejdź do nawigacji
Przejdź do wyszukiwania
(na klasach być powinno) |
m (Zastępowanie tekstu - "<source lang="css">" na "<pre>") |
||
| (Nie pokazano 2 pośrednich wersji utworzonych przez tego samego użytkownika) | |||
| Linia 3: | Linia 3: | ||
Część CSS | Część CSS | ||
< | <pre> | ||
<style> | <style> | ||
.do_lewej { float: left;} | .do_lewej { float: left;} | ||
| Linia 13: | Linia 13: | ||
} | } | ||
</style> | </style> | ||
</ | </pre> | ||
część HTML | część HTML | ||
< | <pre> | ||
<div class="kontener"> | <div class="kontener"> | ||
<div class="do_lewej">To bedzie po lewej :)</div> | <div class="do_lewej">To bedzie po lewej :)</div> | ||
| Linia 23: | Linia 23: | ||
<div style="clear:both;"></div> | <div style="clear:both;"></div> | ||
</div> | </div> | ||
</ | </pre> | ||
[[Plik:Efekt divy w jednej lini.png|200px|thumb|right|Efekt finalny]] | [[Plik:Efekt divy w jednej lini.png|200px|thumb|right|Efekt finalny]] | ||
[[Category:HTML]] | [[Category:HTML]] | ||
Aktualna wersja na dzień 14:35, 18 lut 2018
Aby umieścić dwa DIV-y obok siebie stosujemy poniższy kod.
Część CSS
<style>
.do_lewej { float: left;}
.do_prawej { float: right;}
.kontener
{
border:solid 1px black;
}
</style>
część HTML
<div class="kontener"> <div class="do_lewej">To bedzie po lewej :)</div> <div class="do_prawej">To bedzie po prawej :)</div> <div style="clear:both;"></div> </div>
