Hur gör jag för att få en DIV att scrollas horisontellt istället för vertikalt?
DIV:en i fråga har en bestämd bredd och höjd och dess innehåll skall alltså fortsätta åt sidan istället för nedåt...
Hur göra? Ge mig gärna en exempelkod. Tack!
5 svar · 689 visningar · startad av learn
Hur gör jag för att få en DIV att scrollas horisontellt istället för vertikalt?
DIV:en i fråga har en bestämd bredd och höjd och dess innehåll skall alltså fortsätta åt sidan istället för nedåt...
Hur göra? Ge mig gärna en exempelkod. Tack!
olarsson skrev:
overflow-x är ickestandard. Men fungerar i IE5+ och FF.
overflow-x respektive overflow-y ingår i CSS3 och kan med gott samvete användas.
Nu för tiden kan stödet anses vara fulländat då även Opera och Safari stödjer dessa egenskaper.
Arghh, får det inte att funka...! x(
Så här ser koden ut nu:
<style type="text/css">
body
{
background-color:#000;
}
div#ruta
{
padding:30px;
}
div#bilder
{
padding:10px;
width:400px;
height:200px;
background-color:#FFF;
overflow-x:scroll;
}
div.bild {
float:left;
margin-right:20px;
}
</style>
<div id="ruta">
<div id="bilder">
<div class="bild">
<p><img src="bild1.jpg" /></p>
<p>Bla bla bla bla</p>
</div>
<div class="bild">
<p><img src="bild2.jpg" /></p>
<p>Bla bla bla bla</p>
</div>
<div class="bild">
<p><img src="bild3.jpg" /></p>
<p>Bla bla bla bla</p>
</div>
</div>
</div>
Jag vill alltså att bilderna och dess text ska hamna bredvid varandra och att DIV:en sedan skall scrollas horisontellt. Nu med denna kod hamnar de under varandra med en vertikal scroll. Fel, fel, fel!
Vad gör jag för fel??
Jag har nyligen gjort samma sak. Löste problemet med att lägga en extra bred DIV inuti den mindre "scroll-diven" (i ditt fall #bilder).
Se själv: www.luthagenvåning.se
Efterlyser en bättre lösning. :q