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

Wo ist mein Text?

newbie85

Neues Mitglied
Hallo alle zusammen,
ich habe jetzt nach geraumer Zeit halbwegs meine div container so wie ich sie haben möchte und es funktioniert auch so wie ich möchte. Nur habe ich nun das Problem des der Text den ich eintrage zwar irgendwo sein muss - da sich die höhe des divs geändert hat - aber ich sehe in nicht. Wo liegt der Hund begraben?
Schonmal danke im vorraus für die Hilfe!
PS: Ist mein erster Versuch selbst was zu schreiben, also habt Nachsicht mit mir ;-)

HTML:

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/design.css">
</head>
<body>
<div id="website">
<div id="header">
</div>
<div id="main">
<div id="front" style="position: relative; z-index: 1;">
<div id="back" style="position: absolute; z-index: 0;">
</div>
<br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br>
<br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br>
<br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br><br>TEXT</br>
</div>
</div>
<div id="bottom">
</div>
<div id="footer" >
</div>
</div>
</body>
</html>


CSS:

body {
background-color:black;
text-align:center;
background-image:;
background-repeat:no-repeat;
}
#website {
width:980px;
margin:0 auto;
}
#header {
width:980px;
height:200px;
background-color:#5A0000;
margin-bottom:15px;
box-shadow: 5px 5px 5px black;
}
#back {
width:980px;
height:100%;
background-image:url("bilder/mainbackground.jpg");
opacity: 0.8;
}
#front{
width:980px;
min-height:350px;
background-image:url("bilder/mainbackground1.png");
margin:0 auto;
text-align:center;
}
#main {
width:980px;
min-height:350px;
box-shadow: 5px 5px 5px black;
}
#bottom {
width:980px;
height:5px;
background-color:#5A0000;
margin:0 auto;
margin-bottom:15px;
background-image:url("bilder/unten.jpg");
box-shadow: 5px 5px 5px black;
}
#footer {
width:980px;
height:30px;
background-color:#5A0000;
text-align:center;
background-image:url("bilder/footer.jpg");
display: table-cell;
vertical-align: middle;
box-shadow: 5px 5px 5px black;
}
 
Der Text ist in der mitte, halt schwarzer text => schwarzer hintergrund, da hast wenig kontast :O).

Cheffchen
 
Vielen Dank für die Hilfe!!

Dachte durch den Hintergrund in dem div darunter würde man die Schrift sehen!? Habe desshalb nichtmal annähernd daran gedacht :D
Danke nochmal.
 
Ok bevor ich wieder Ewigkeiten damit verbring den nächsten Fehler zu finden frage ich gleich nocheinmal etwas in diesem Zusammenhang:
Den Text seh ich jetzt durch Farbveränderung, aber er hat so wie es aussieht auch die Transparenz von dem div #back abbekommen, kann das sein (sollte nämlich nicht)?
Wie kann ich das dann ändern das nur das Hintergrundbild von #back und nicht der Inhalt (Text und Bilder) von #front transparent wird?
 
Ok bevor ich wieder Ewigkeiten damit verbring den nächsten Fehler zu finden frage ich gleich nocheinmal etwas in diesem Zusammenhang:
Den Text seh ich jetzt durch Farbveränderung, aber er hat so wie es aussieht auch die Transparenz von dem div #back abbekommen, kann das sein (sollte nämlich nicht)?
Wie kann ich das dann ändern das nur das Hintergrundbild von #back und nicht der Inhalt (Text und Bilder) von #front transparent wird?

Ja, das sollte so sein - wenn du jemals mit einem Bildbearbeitungsprogramm gearbeitet hast, sollte klar sein warum.

Wenn du das nicht willst, darf der Text nicht in einem transparenten Container liegen.

Bevor du eine weitere Frage stellst, poste doch lieber ein funktionierendes Beispiel. zB mit jsfiddle.net
 
Zurück
Oben