• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Wir haben den Frühjahrsputz beendet, Ihr auch? Welches Foto zu dem Thema hat Euch dann am Besten gefallen? Hier geht es lang zur Abstimmung --> Klick

[CSS&HTML]Div um Div mit anderem Background

Bomberzocker

Auralia
Registriert
08.06.08
Beiträge
202
Hi!
Ich habe auf http://benediktvogler.de/ einen schwarzen Schatten um den Inhalt. Leider endet der Kasten etwa 40px zu früh. Das ganze soll sich dynamisch an die länge des Inhaltes anpassen deswegen kann ich keine bestimmte länge setzen. Am Ende habe ich ein div gesetz was nach beiden divs kommt (im Aufbaubeispiel Schattenende genannt) und wieder den grauen Hintergrund einleitet.

Der Aufbau ist jetzt so:
Schatten
---Inhaltsdiv
---/Inhaltsdiv
/Schatten
Schattenende /Schattenende


CSS:
Code:
#shadow {
	margin:0 auto;
	width:750px;
	text-align:center;
	background-image:url(shadow.png);
	background-repeat:repeat-y;
	}
	
#shadowend {
	margin:0 auto;
	z-index:10;
	width:750px;
	text-align:center;
	background-image:url(backgroundimage.png);
	background-repeat:repeat-y;
	}

HTML:
Code:
<div id="shadow">
		<div id="container">
			<div id="headerbild"></div>
			<p class="Menu"><a class="Menu" href="index.asp">Start</a></p>&nbsp;&nbsp;&nbsp;&nbsp;
			<p class="Menu"><a class="Menu" href="ueber_mich.asp">&Uuml;ber mich</a></p>&nbsp;&nbsp;&nbsp;&nbsp;
			<p class="Menu"><a class="Menu" href="hobbys.asp">Hobbys</a></p>&nbsp;&nbsp;&nbsp;&nbsp;
			<p class="Menu"><a class="Menu" href="http://bombing-games.benediktvogler.de">Bombing Games</a></p>&nbsp;&nbsp;&nbsp;&nbsp;
			<hr class="Menu">
			<h2>Herzlich Willkommen!</h2>
			<p>Dies ist meine Webseite. Ich hoffe sie gef&auml;llt Ihnen. Die meisten Designfehler sind nun behoben und nur noch ein schwarzer Hintergrund sollte st&ouml;ren.<br>
			</p>
		</div>
	</div>
	<div id="shadowend"></div>

Mit javascript geht das doch sicher auch, aber eine einfachere Lösung mit css und html ist doch sicher besser.
mfg
 

siris

Golden Delicious
Registriert
25.02.09
Beiträge
11
Wie genau soll denn der Schatten nach unten enden? Einfach hart abgeschnitten und darunter kommt dann wieder der graue Hintergrund? Dann reicht es, wenn Du dem div#shadow "padding-bottom:40px" gibst. Ich würd' sogar das "position:relative; top:20px;" vom div.container ganz wegnehmen und dem div#shadow oben und unten 20px padding geben, wenn Du über- und unterhalb des div#container 20px Abstand haben willst.

Und nebenbei fehlt der Seite noch das komplette html-Element.
 
  • Like
Reaktionen: Bomberzocker

Bomberzocker

Auralia
Registriert
08.06.08
Beiträge
202
Hey danke! Hat funktioniert.
Das ganze sollte wie bei http://www.newgrounds.com/ werden, aber die haben das Problem einfach gelöst indem die Seite immer bis nach unten geht.
Ich mach dann noch nen Verlauf vom schwarz zum grau oben drüber und drunter. Vermutlich das Schwarz noch was helelr und dann siehst auch gut aus.
 

Synoxis

Sonnenwirtsapfel
Registriert
09.06.09
Beiträge
2.401
Wozu überhaupt den DIV #shadowend? Den braucht man doch garnicht? Es wird doch so oder so der Hintergrund vom BODY angezeigt.