Background-color

09/05/2015 15:02 DerSaboteur#1

Hey Epvper

Hab da ein kleines problem ich m�chte das mein Background auf der seite halb schwarz und halb wei� ist.. das habe ich soweit hin bekommen mit..

Code:

body {
    background: linear-gradient(90deg, white 50%, black 50%);
}

so dies sollte eig nur die height von 150px haben und danach wieder komplett wei�..

[Only registered and activated users can see links. Click Here To Register...]

Mfg DerSaboteur

�dit: HTML und CSS code bisher

HTML :

HTML 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>Thomas-Photography</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head><body>
<div id="wrapperarea">
    <div id="header">
        <a href="index.htm"><img src="img/header.png" alt="img_header" /></a>
    </div>
</div>
</body></html>

CSS:

Code:

@charset "utf-8";
* {
    margin: 0px;
	padding: 0px;
	font-family: Georgia;
	font-size: 12px;
	line-height: 1.5;
}
body {
    background: linear-gradient(90deg, white 50%, black 50%);
}

#wrapperarea {
	width: 1017px;
	margin-right: auto;
	margin-left: auto;
}
#wrapperarea #header {
 height: 750px;
}

09/05/2015 15:28 sven12345#2

im Moment gibts du ja deinem Body den gradient als Eigenschaft, der Body umschlie�t den gesamten Content weshalb die komplette Seite den Hintergrund bekommt. Au�erdem ist auch noch gar keine H�he in deinem css definiert, am besten du versuchst mal den background auf den header zu legen und eine H�he zu definieren.

09/05/2015 15:34 DerSaboteur#3

Das problem ist das ich den header in dem #wrapperarea habe damit die seite quasi immer auf 1017px bleibt.. setze ich den header aus dem div container #wrapperarea schiebt sich das bild nach links und wenn ich es mittig ausrichte muss ich es einem width geben.. und dann bekomme ich trz. nicht das was ich will.. habe auch schon mind. 2 jahre nichts mehr mit html und css allgemein homepages gemacht..

09/05/2015 16:41 sven12345#4

dann mach einfach ein div dr�ber au�erhalb von der wrapperare mit width: 100% (position: absolut), dem gradient und der h�he, dann sollte das gehen - falls nicht kann sein das du ein bisschen mit dem z-index rumspielen musst

09/05/2015 18:17 DerSaboteur#5

also ich hab das jetzt so wie ich es haben wollte.. hab jetzt einfach um das img. ein <center> gesetzt was ich eig vermeiden wollte..

09/05/2015 19:38 .SkyneT.#6

Quote:

Originally Posted by DerSaboteur

also ich hab das jetzt so wie ich es haben wollte.. hab jetzt einfach um das img. ein <center> gesetzt was ich eig vermeiden wollte..

Nur zur Beruhigung, die seite "google.com" verwendet auch <center> tags ;)