Wyswietlanie w linii

Odpowiedz Nowy wątek
2009-02-26 09:32

Rejestracja: 11 lat temu

Ostatnio: 7 lat temu

0

Jak zmusić elementy konkretnego diva aby były wyświetlane w linii i ewentualnie jeżeli zabraknie miejsca zeby były przewijane w POZIOMIE. samo ustawienie w linii jest dosyć proste jak sądzę przez float: left ale problem jest w tym że jeżeli ilość obrazków jest większa niż szerokość diva to są one dodawane pod sobą a tak być nie może. Jakieś praktyczne rozwiązanie poza używaniem ramek?
Pozdrawiam

Pozostało 580 znaków

anonymous120
2009-02-26 12:42
anonymous120
0

display: inline ?

Pozostało 580 znaków

ŁF
2009-02-26 13:38
ŁF
Moderator

Rejestracja: 17 lat temu

Ostatnio: 1 tydzień temu

0

inline zawinie elementy po dojściu do 100% szerokości parenta, niezależnie od scroll. w zasadzie nie widzę żadnego sposobu, na ustawienie przez css, żeby linia nie była łamana po osiągnięciu szerokości rodzica.
tak wiec poniżej nieco kulawe (podpierające się js) rozwiązanie:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html> <head> <title></title> <style type="text/css"> html, body {margin:0;width:100%;height:100%;} #container {width:100%;overflow:scroll; background:#ff0;} .item {width:220px;height:100px;background:#f00;padding:0;margin:10px;float:left;display:block;} </style> </head> <body>
<script type="text/javascript"> var items = document.getElementById("subcontainer").childNodes; var width = 0; for (var i = 0; i < items.length; i++) if (items[i].nodeType == 1) width += 1 + items[i].offsetWidth + 20; // tu problem - zamiast 20 powinien być lewy i prawy margines elementu, ale nie umiem tego wyciągnąć. +1 jest dzięki IE6 document.getElementById("subcontainer").style.width = width+"px"; </script>
</body> </html>

Pozostało 580 znaków

2009-02-26 14:27

Rejestracja: 11 lat temu

Ostatnio: 7 lat temu

0

ok dzieki wielkie za pomoc :)

Pozostało 580 znaków

Odpowiedz

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0