Wieder mal wiederholender Hintergrund

Status
Nicht offen für weitere Antworten.
Kalma

Kalma

Erfahrenes Mitglied
Hey.

Habe wieder fast das selbe Problem wie beim Letzen mall :offtopic: :-(

Und zwar soll ich für eine Band eine Seite machen und ich dachte an sowas:

http://sites.dfmusik.de/siab/

Nur Leider haut das alles mit dem Padding und Breitenangaben nicht so richtig hin....


Wer könnte sich das ganze mal angucken?


index.php
HTML: 
<html>
	<head>
		<title>Stork in a Bottle ONLINE</title>
		<link href="style.css" type="text/css" rel="stylesheet" />
	</head>
<body>
	
	<div id="wrapper">
		<div id="kopf">&nbsp;</div>
		
		<div id="menu">Heyho - Menu</div>
		
		<div id="cont_kopf">Heyho - Site-Titel</div>
		
		<div id="cont_body">
			Heyho - Content
		</div>
		
			<div id="clear_all">&nbsp;</div>
		
			<div id="cont_fuss">Heyho - Copyright</div>
	</div>

</body>
</html>


css
Code: 
body {
	background:url(images/bg.jpg) repeat-x;
	background-color:#707A7B;
	
	font-family:"Verdana";
	font-size:12px;
	font-color:#000000;
}

#wrapper {
	width:710;
	
	margin:0px auto;
	margin-top:15px;
}

#kopf {
	width:100%;
	height:141;
	background:url(images/kopf.jpg);
	margin:0px;
}

#menu {
	width:698;
	height:24px;
	background:url(images/menu.jpg) repeat-x;
	margin:0px;
	padding:6px;
	padding-top:14px;
}

#cont_kopf {
	width:666;
	height:19;
	background:url(images/cont_kopf.jpg);
	margin:0px;
	padding:22px;
	font-size:20px;
	color:#7C0400;
}

#cont_body {
	width:100%;
	background:url(images/cont_body.jpg) repeat-y;
	margin:0px;
}

#clear_all {
 	clear: left;
 	margin: 0;
 	padding: 0;
 	height: 0;
 	line-height: 0;
 	font-size: 1px;
}

#cont_fuss {
	width:100%;
	height:50;
	background:url(images/cont_fuss.jpg);
	margin:0px;
}


Danke im Voraus
David
 
Am gezeigten Quellcode ist mir zunächst aufgefallen, daß dem HTML-Dokument eine Dokumenttyp-Deklaration, sowie bei manchen height-, und width-Werten (die größer als null sind) die Einheit Pixel fehlt.

Das Problem mit den padding-Angaben bekommst Du in den Griff, wenn Du sie an ein Kindelement innerhalb des DIVs übergibst.

So wird beispielsweise aus:

Code: 
#menu {
        width:710px;
        height:38px;
        background:url(images/menu.jpg) repeat-x;
        margin:0;
        padding:6px;
        padding-top:14px;
}
das hier:

Code: 
#menu {
        width:710px;
        height:38px;
        background:url(images/menu.jpg) repeat-x;
        margin:0;
        padding:0;
}

#menu ul {
        padding:6px;
        padding-top:14px;
}
Und im HTML-Quellcode sieht das dann so aus:

HTML: 
<div id="menu">
          <ul><li><a href="#">Heyho - Menu</a></li></ul>
</div>
Das spielst Du mit allen DIVs durch, die Text enthalten sollen, packst den Text in ein entsprechendes Element zur Textstrukturierung und formatierst es mit dem gewünschten Innenabstand.
 
Hey.

Geile Sache, danke SeHr.


Aber wenn ich das so mache:
<ul><li>bla</li></ul>
macht der doch vorher son doofen Listenpunkt, wie bekomme ich den wech?

MfG
David
 
Entweder so:

Code: 
ul {
list-style-type: none;
}

oder so:

Code: 
li {
display: inline; /* richtet Listenpunkte horizontal aus */
}
 
Du solltest Dich zunächst noch einmal ernsthaft mit dem Grundgerüst einer HTML-Datei auseinandersetzen.

Desweiteren darf eine ID in einem Dokument nur einmal vergeben werden.

Wenn die Markup-Fehler in dem Dokument behoben sind, kannst Du Dich hier wieder melden.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück