• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Header zeigt Logo verschoben an.

t-stephan

Neues Mitglied
Guten Abend,

Ich habe mir einen Header erstellt wo rechts ( 85% ) das Anmelde fenster ist und Links das Logo bzw der Name.
CSS Datei:
Code:
#body {
    padding: 0;
    margin: 0;
}

#box1 {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 45px;
    border-bottom: 1px solid #000000;
    background-color: #151515;
    width: 100%;
}

#logo {
    font-style: normal;
    font-family: arial;
    font-size: 30px;
    text-decoration: none;
    color: #0040FF;
    font-weight: bold;
    padding-left: 15px;
}


Html Code:

HTML:
<body>
<div id="box1">
<form id="formedit" action="userprofil.php" type="POST">
<input type="text" name="admin" value="username">
<input type="password" name="password" value="password">
</form>
<p id="logo"> TOBIASSTEPHAN</p>
</body>
</html>


Das Problem ist das er den Text unter den Text unter den Header angibt was kann ich machen?
 
Ich steige zwar nicht ganz durch den gewünschten und momentan vorhandenen Aufbau durch (vielleicht stellst du zum besseren Verständnis nen Screen rein?) aber vielleicht hilft es schon, dass du den div-Tag schließt.
 
div war geschlossen nur den vergessen mit zu kopieren :D^^
Hier wie es im Browser aussieht:

page.jpg

TOBIASSTEPHAN soll aber nicht unter dem schwarzen Balken stehen sondern drinne...

So hier der HTML Code:

screen.jpg


Und hier der CSS code:

screen2.jpg
 
Deine Screenshots sind viel zu klein, besonders die vom Quellcode die eigentlich unnötig sind da Du ihn ja oben schon gepostet hast.

Du hast 2 Blockelemente in #box1 eingefügt. Dadurch stehen diese natürlich untereinander. Du müsstest einen oder beide floaten, damit Du das erreichst was Du willst. Ergänze z.B. noch

Code:
#formedit { float: right;width: 85%; }
 
Ich vermute mal mit "Rand" meinst Du die Hintergrundfarbe deines Headers. Das liegt am floaten. Wer floatet muss auch clearen ;) Oder Du gibst dem Header, da er absolut positioniert ist, auch eine feste Höhe in der Höhe die Login-Bereich und Seitentitel einnehmen, z.B. 30px.
 
Zurück
Oben