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

Wie umsetzen?

N

nick.90

Neues Mitglied
Guten Tag,
bin grad neu hier im Forum aber hab doch gleich die erste Frage:
bowlerezepte.jpg - Bilder und Fotos kostenlos auf ImageBanana hochladen

Wie bekomme ich dort das untere Teil ohne Änderungen umgesetzt?
Es beginnt der Content ja praktisch oben aber nach dem schwarzen ändert sich der fortlaufende Hintergrund.
Den Text unten beginnen zu lassen ist natürlich keine Option.

Habe versucht mit position:relative; den Text nach oben zu versetzen, hat auch gut geklappt, aber dann hatte ich unten etlich langen Background ohne Inhalt.

Und mit Position:Absolute nur über den Text hat sich der Hintergrund nicht verlängert.

Hat jemand ne andere Idee?

Danke für die Hilfe.
 
Hallo nick.90,
es hilft immer weiter, wenn man seine Versuche zeigt, damit wir helfen können. Kannst du mal deinen Code posten?

Ich bin mit deiner Problembeschreibung noch etwas überfordert.

MfG xXxPeterPanxXx
 
Hier der Code

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<!-- Top -->
<div id="top">
<div id="logo"></div>
<form method="post" name="search" style="border:0px;">
<input type="text" class="search" border="0" value="Suchbegriff" />
<input type="submit" class="submit" name=" " title=" " value=" "/>
</form>
</div>
<!--- Navi Area -->
<div id="navi">
<div class="vornavi"></div>
<div class="navi">
<ul id="navigation">
<!-- Navibutton -->
<li class="navibutton">
<a class="navibutton" href="#">HOME</a>
</li>
<!-- Navibutton -->
<li class="navibutton">
<a class="navibutton" href="#">HOME</a>
</li> </ul>
</div>
<div class="nachnavi"></div>
</div>
<!-- Header Area -->
<div id="header"></div>
<!-- Contentare -->
<div id="content_left"></div>
<div id="content"></div>
<div id="content_right"></div>
<div id="content_2">
<div class="content_text">
<p>
Ein Elend langer Texst, der nervt.<br />
Ein Elend langer Texst, der nervt.<br />
Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />Ein Elend langer Texst, der nervt.<br />
</p>
</div>
</div>

</body>
</html>
Zum Vergrößern anklicken....

body {
background-color:#fff0d7;
padding:0px;
margin:0px;
border:0px;
outline:none;

}

div#top {
width:982px;
height:74px;
padding:0px;
margin:0px;
border:0px;
}


div#logo {
background-image:url(Bilder/top_01.jpg);
width:487px;
height:74px;
float:left;
padding:0px;
margin:0px;
border:0px;
}

input.search {
background-image:url(Bilder/top_02.jpg);
width:248px;
height:43px;
border:none;
outline:none;
padding-left:140px;
padding-top:30px;
margin:0px;
float:left;
}

input.submit {
background-image:url(Bilder/top_04.jpg);
width:36px;
height:50px;
border:0px;
margin:0px;
margin-top:12px;
outline:none;
float:left;
}

div#navi {
width:982px;
height:59px;
padding:0px;
margin:0px;
border:0px;
}

div.vornavi{
background-image:url(Bilder/head_07.jpg);
width:252px;
height:59px;
padding:0px;
margin:0px;
border:0px;
float:left;
}

div.navi {
background-image:url(Bilder/head_08.jpg);
height:59px;
width:659px;
float:left;
padding:0px;
margin:0px;
border:0px;
}

div.nachnavi {
background-image:url(Bilder/head_12.jpg);
width:71px;
height:59px;
padding:0px;
margin:0px;
border:0px;
float:left;
}

div#header{
background-image:url(Bilder/head_14.jpg);
width:982px;
height:93px;
padding:0px;
margin:0px;
border:0px;
}

ul#navigation {
list-style:none;
padding:0px;
margin:0px;
border:0px;
}

li.navibutton {
float:left;
background-image:url(Bilder/head_08.jpg);
height:40px;
padding-top:19px;
margin-right:7px;
padding-right:5px;
padding-left:5px;
}

li.navibutton:hover {
float:left;
background-image:url(Bilder/head_10.jpg);
height:40px;
padding-top:19px;
margin-right:7px;
padding-right:5px;
padding-left:5px;
}

a.navibutton {
font-family:Verdana, Geneva, sans-serif;
font-size:12px;
font-weight:bold;
text-decoration:none;
color:#84ac05;
}

li.navibutton:hover a.navibutton {
color:#FFF;
}

div#content_left {
background-image:url(Bilder/side_15.jpg);
width:134px;
height:433px;
padding:0px;
margin:0px;
border:0px;
float:left;
}

div#content {
background-color:#FFF;
width:621px;
padding:0px;
margin:0px;
border:0px;
float:left;
height:430px;
}

div#content_right {
background-image:url(Bilder/side_17.jpg);
width:227px;
height:433px;
float:left;
}

div#content_2 {
background-image:url(Bilder/content_20.jpg);
width:627px;
padding:0px;
border:0px;
margin-left:122px;
padding-left:20px;
}

div.content_text {
/**position:relativ; */
top:-435px;
}
Zum Vergrößern anklicken....
Wie gesagt, mein Problem ist eigentlich dass ich 2 BG's für ein Content brauch.
 
Zuletzt bearbeitet:
Aber dann habe ich doch mit der Leiste (siehe Screen) Probleme.

Ich habs ums einfach auszudrücken oben ein schmaleren Content als unten, weil unten noch der Schalgschatten dranhängt.

Naja hab den Effekt einfach entfernt was solls^^
 
dann lass den context und schreib deine Texte einfach so in den #content Bereich, denn 2 Bg das geht nicht, ansonsten den BG mit Photoshop oder einem anderen Bildbearbeitungsprogramm so verändern dass die 2 BG übereinander sind.
 
Habe noch ein Problem.

Im neuen Opera und Firefox hängt bei der Suche der Schriftzug Suchbegriff
(also bei einem einzeiligen Formularfeld -> Schrift innen drinne) unterhalb der Box.
Chrome,IE und der alte FF zeigen den Suchbegriff aber an der richtigen Stelle.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben