simple css frage

gelöschter User

Hi,
hab auch mal wieder ne frage:

will 2 divs nebeneinander bringen klappt aber net^^:

Code

#menu {
width:150px;
margin-top:30px;
border: 1px solid;
padding-left:10px;
background-color:#fead00;
}


#inhalt {
width:480px;
min-height:300px;
}


[u]#menu, #inhalt {
float: left;
}[/u]

Alles anzeigen

so das ist das Stylesheet (das was relevant ist vom stylesheet)

Code

<div id="wrapper">
	[img]img/header.png[/img]
	<div id="menu">
		<div id="style">
			[b]Navigation[/b]


		
			Home


			Galerie


			About


			Service


			Impressum


		</div>
	</div>
	<div id="linkpartner">
			<div id="style">
			[b]Linkpartner[/b]


				
			[url='www.aumand.at']www.aumand.at[/url]


			[url='#']Link#2[/url]


			[url='#']Link#3[/url]


		</div>
	</div>




	<div id="inhalt">
	Der Penner ist wieder da... Hura Hura :D.
	</div>

Alles anzeigen

und das der ganze body vom index.

danke schonmal für die hilfe die gleich kommt^^

mfg

Alienx

Hi,

du setzt bei beiden divs ein "float:left" ein, da ist es klar, dass diese nicht nebeneinander stehen, da sonst einer den anderen überlagern müsste.

Wieso machst du nicht einen Div mit der Höhe und Breite, die die beiden Container, die nebeneinander stehen sollen, zusammen einnehmen und packst diese dann einfach in den? Wenn genügend Platz vorhanden ist, sollten sie auch nebeinander stehen.

MfG Alienx

gelöschter User

jo danke alienx.
aber sonst hat's immer so geklappt
ok ich werds mal mit nem div machen wo die beide drin stehn!

mfg

edit: hab jetz so nen div gemacht aber es bleibt unverändert!

synaptic

haste mal probiert nur dem zwiten div nen float:left zu geben?

gelöschter User

funktioniert auch nicht

mfg

Alienx

Hio,

habs eben nochmal probiert, funzt doch.

HTML

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




<html xmlns="http://www.w3.org/1999/xhtml"
       xml:lang="de" lang="de">
       <head>
              <meta http-equiv="Content-Type"
                      content="text/html; charset=utf-8" />


               <title>Alienx</title>


</head>


<body>


<div style="width:810px;height:810px;">


<div style="width:400px;height:400px;border:1px solid #5d5d5d;float:left;">
</div>


<div style="width:400px;height:400px;border:1px solid #5d5d5d;float:right;">
</div>


</div>


</body>
</html>

Alles anzeigen

Ergebnis kannste dir hier ansehen. Sind zwei Divs mit ner Breite und Höhe von je 400px. Beide liegen in einem 810px hohen und 810px breiten Container, wobei der eine der beiden eingeschlossenen DIVs links und der andere rechts floatet. Getestet mit Safari, FF, IE, TOB und Opera.

MfG Alienx

gelöschter User

jo so würdes funktionieren was aber wenn da jetz noch ein dritter kasten ganz rechts hin soll?

mfg

Alienx

Dann vergrößerst den DIV, der die anderen einschließt und packst nochmal einen Container rein, der wieder rechts floatet.

Also etwa so:

HTML

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




<html xmlns="http://www.w3.org/1999/xhtml" 
       xml:lang="de" lang="de"> 
       <head> 
              <meta http-equiv="Content-Type" 
                      content="text/html; charset=utf-8" /> 


               <title>Alienx</title> 


</head> 


<body> 


<div style="width:630px;height:810px;"> 


<div style="width:200px;height:400px;border:1px solid #5d5d5d;float:left;"> 
</div> 


<div style="width:200px;height:400px;border:1px solid #5d5d5d;float:right;"> 
</div> 


<div style="width:200px;height:400px;border:1px solid #5d5d5d;float:right;"> 
</div> 


</div> 


</body> 
</html>

Alles anzeigen

MfG Alienx

The User

display: inline kann auch helfen, aber das manipuliert auch andere sachen.

sejuma

http://www.ohne-css.gehts-gar.net/0027.php
http://www.ohne-css.gehts-gar.net/0007.php

gelöschter User

jo danke euch allen!
habs jetz etwas anders als erst geplant gemacht aber habt mir trotzdem sehr geholfen!

mfg

Tags