Frage über "div"...

123123123

Erfahrenes Mitglied
Hallo Leute,

ich nehme als Beispiel die Seite http://de-de.facebook.com/

Wie kann ich auch so einen blauen horizontalen Balken erstellen (wo man den benutzername und so eingibt) erstellen!

keine Sorgen will nicht die Seite nachmachen. Ich habe hier auch so einen erstellt, aber der hat noch rechts und links einen Abstand , möchte aber sowas nicht!
HTML:
<html>
	<head>
</head>
<link rel="stylesheet" type="text/css" href="test.css">

<body>
	<div id = "seite">
		<div id="oben"></div>
		</div>
</body>
</html>
Code:
#oben {
		margin-top: 100px;
		border-style:solid;
		border-width:1px;
		height:25px;
		width:1260px;
		background-color:#673300;
}

Danke!
 
Zuletzt bearbeitet:

tombe

Erfahrenes Mitglied
Ich würde via CSS einfach dem DIV die Farbe und die Größe zuweisen und dann die Positionierung der Textfelder usw. mit Hilfe einer Tabelle vornehmen.
 

tombe

Erfahrenes Mitglied
Es gibt sicher mehre Möglichkeiten das zu lösen. Doch ich denke halt das es so am einfachsten wäre.
 

OpaBenno

Grünschnabel
Also ich habe mir in die CSS folgendes eingebaut:
margin: 100px -10px 0px -10px;
Bei solchen Viererketten zählt man:
oben, rechts, unten, links.
Ich meine auch, nur wenn man eine Tabelle erstellen will,
sollte man auch mit Tabellen arbeiten.
 

tombe

Erfahrenes Mitglied
Ich verstehe nicht so ganz was das jetzt zur Lösung beiträgt.

Aber wenn man sich den Quelltext der oben genannten Seiten anschaut, dann erkennt man das es dort zumindest teilweise auch mit einer Tabelle gelöst wurde!

Außerdem habe ich nicht gesagt das es keine andere Lösung dafür gibt.
 

fbfeix

Erfahrenes Mitglied
probiers doch mit Floats (ist jetzt ausm Kopf )

HTML:
<div id = "seite">
	<div id="oben">
              <div id="rechts">
                  <input type="text" name="usermail" class="userinputboxes" />
                  <input type="password" name="userpassword"  class="userinputboxes"/>
              </div> 
        </div>
</div>

CSS:
.userinputboxes
{
display: inline;
}

#rechts
{
float: right;
}

Am besten du fügst noch Labels für jeden Input ein damit der Nutzer auch weiß was er eingeben soll.
Um deinen Rand wegzubekommen:
CSS:
body
{
margin: 0px;
padding: 0px;
}
 

123123123

Erfahrenes Mitglied
Danke dir fbfeix, aber ich brauche keine Inputs, ich möchte einfach nur wissen, wie man diesen oben blauen horizontalen Balken aufbaut.
Der sieht ja so aus, als ob es unendlich wäre, ich schaffe es nur, das er eine bestimmte width Größe hat! :)