CSS Div Container Neben zweiten

Hey,

ich hab ein Problem bei der anordnung meiner Divcontainer.

Also ich hab es so aufgebaut

header - beinhaltet -> logo + box container.

Logo (ist das logo oben) box ist diese graue leicht transparente box, die soll nicht unter logo sondern neben logo mit float rechts. bekomme die aber halt nicht hoch.

Spoiler anzeigen

  

- Tom

Ach ja, entschuldige.

Hier:

#header {
width:100%;
height:121px;
}

#logo {
border-width:2px;
border-color:red;
border-style:solid;
width:287px;
height:119px;
}

#box {
float:right;
margin-top:10px;
border-width:2px;
border-color:red;
border-style:solid;
width:350px;
height:70px;
background:grey;
opacity:0.7;
}

- Tom

Ah ja stimmt, danke.

float: left; hatte ich schon nur dann sind die container die unten drunter sind nach oben gerutscht, zu weit.

display: inline-block; hat gefehlt, jetzt gehts, danke

//edit: Ich hab jetzt nen Problem. Der Menü Div (erster grüner balken) rutscht nach unten sobald ich die <ul> Liste fürs menü einsätze. Normalerweiße soll der grüne balken diekt ans logo links oben angrenzen was ohne die liste auch geht.
Und wenn der balken nicht runterrutschen würde wäre die Liste auch mittig von dem div.

Spoiler anzeigen

#menu {
height:50px;
width:100%;
margin-top:0px;
background-image:url(grafiken/bg.jpg);
border-radius: 7px;
-moz-border-radius: 7px;
text-align:center;
}


#menu ul li {
display:inline;
}


.link {
text-decoration:none;
font-family:verdana;
font-size:20px;
text-shadow: 1px 1px 5px #000;
text-align:center;
}


.link:hover {
text-shadow: 1px 1px 5px #A4A4A4;
transition: text-shadow 0.5s;
-webkit-transition: text-shadow 0.5s;
}

Das der Code vom CSS. Menü ist der ganze grüne balken menu ul die liste und link sind die einzelnen <li> Items.

//edit2: Kann mir keiner sagen wieso sich das selbstständig macht?

- Tom

Oh, tut mir Leid.

<div id="header">	<div id="logo">	  <a href="http://lenni94.bplaced.net"><img src="grafiken/logo.png"></a>	</div>	<div id="box">	<table border="0" style="margin: auto;" width="80%">	  <tr>		<td><img src="http://cdn1.iconfinder.com/data/icons/fatcow/32/folder.png"><br></td>		<td><a class="link2" href="http://lenni94.bplaced.net">Forum</a></td>	  </tr>		  <tr>		<td><img src="http://activitiesinhawaii.com/media/wysiwyg/youtube_icon.png"> </td>		<td><a class="link2" href="http://www.youtube.com/user/HuedelFuedel?feature=watch">Youtube Channel</a></td>	  </tr>	</table>	</div>  </div>

//edit: ich hab jetzt bei #menu position: absolute; drin.
Jetzt sitzt das menü und alles drüber richtig, aber das drunter rutscht nun unter den header. wie verhinder ich das?

Spoiler anzeigen

  

- Tom

Hab ich schon probiert. Mit absolute rückt es nach oben, nur hat es unangenehme nebeneffekte.
Ohne das rutscht dann alles wieder runter.

- Tom