nicht angemeldet
Hallo,
ich habe ein float Problem komme einfach nicht weiter und wäre euch sehr dankbar für eure Hilfe!
Ich habe mehrere Boxen die ich in zwei übergeordnete Boxen (#mainbox1 und #mainbox2) gesteckt habe.
Nun hätte ich gerne das diese beiden 'mainboxen' nicht untereinander floaten, so wie sie es jetzt gerade tun sondern horizontal nebeneinander.
Könnt ihr mir helfen?
<style type="text/css" media="screen">
#mainbox1
{ background-color: green; margin-right: 20px; list-style-type: none; top: auto; left: 0px; width: 100%; height: auto; min-width: 1250px; float: left }
</style>
<style type="text/css" media="screen">
#mainbox2
{ background-color: red; list-style-type: none; top: auto; left: auto; width: 100%; height: auto; min-width: 1250px; float: left; }
</style>
<style type="text/css" media="screen">
#MUSIC
{ list-style-type: none; z-index: 10; top: 0px; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box1
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<style type="text/css" media="screen">
#VIDEO
{ list-style-type: none; z-index: 10; top: 0px; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box3
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<style type="text/css" media="screen">
#DIARY
{ list-style-type: none; z-index: 10; top: 0px; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box5
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<style type="text/css" media="screen">
#ABOUT
{ list-style-type: none; z-index: 10; top: auto; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box7
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<style type="text/css" media="screen">
#SHOP
{ list-style-type: none; z-index: 10; top: auto; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box8
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<style type="text/css" media="screen">
#SIGNUP
{ list-style-type: none; z-index: 10; top: auto; left: 0px; width: 100%; height: 100%; min-width: 1250px; float: left }
#box9
{ text-align: center; list-style-type: none; margin-top: 15%; z-index: 11; right: 0; left: 0; width: 100%; height: auto; }
</style>
<div id="mainbox1">
<div id="MUSIC">
<div id="box1">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div>
<div id="VIDEO">
<div id="box3">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div>
<div id="DIARY">
<div id="box5">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div>
<div id="ABOUT">
<div id="box7">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div></div>
<div id="mainbox2">
<div id="SHOP">
<div id="box8">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div>
<div id="SIGNUP">
<div id="box9">
<a href="#" name="1"><img src="dot.gif"></a>
<a href="#" name="2"><img src="dot.gif"></a>
<a href="#" name="3"><img src="dot.gif"></a>
</div></div>