The_Bandito
Neues Mitglied
Hi,
Das ist mein erstes Design per PS erstellt so nun habe ich es gecodet. Alles gut in meine Editor W3C gibt auch alles als gut aus.
So im Editor sieht es so aus:
Genau wie es sein soll
Aba wenn ich es hochlade sieht es so aus:
Also KA was das ist-.-
hier die index.html datei:
und hier die style.css
Könnt ihr mir sagen was ich falsch mache?:(
Das ist mein erstes Design per PS erstellt so nun habe ich es gecodet. Alles gut in meine Editor W3C gibt auch alles als gut aus.
So im Editor sieht es so aus:
Genau wie es sein soll
Aba wenn ich es hochlade sieht es so aus:
Also KA was das ist-.-
hier die index.html datei:
HTML:
<!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>
<title>Eike</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
</head>
<body>
<div id="ram">
<div id="header"></div>
<div id="content"><p>
Navigation <br/>
Startseite <br/>
GB-Bilder <br/>
News <br/>
Gästebuch <br/>
Kontakt <br/>
</p></div>
<div id="text"><h1>Startseite</h1>
<p>
Hallo und Hallo=)
</p></div>
<div id="footer"></div>
</div>
</body>
</html>
Code:
body {
background: #ECEBD9 url('images/Design-Hintergrund.jpg') repeat; /* Hintergrundbild das senkrecht wiederholt wird */
color: #686864; /* Schriftfarbe */
font: 0.9em 'Trebuchet MS', Geneva, Arial, Helvetica, sans-serif; /* Schriftgroesse und Schriftart */
margin: 0px; /* Aussenabstand */
}
p, pre{
padding: 0px 0px; /* Innenabstand */
margin: 0px; /* Aussenabstand */
color: #000000; /* Schirftfarbe */
}
ul {
list-style: square; /* Liststyle => Quadrat */
}
.left {
text-align: left; /* Textausrichtung */
float: left; /* Element umfließen lassen - links */
padding-left: 5px; /* Innenabstand */
}
.right {
text-align: right; /* Textausrichtung */
}
/* ----------------------------------------- */
#ram {
background: url('images/Design-Content.jpg') repeat-y; /* Hintergrundbild das senkrecht wiederholt wird */
width: 952px; /* Bereit des Div-Elements */
margin: 20px auto; /* Aussenabstand - durch auto = mittige Ausrichtung */
}
#header {
background: url('images/Design-Header.jpg') repeat-y; /* Hintergrundbild das senkrecht wiederholt wird */
width: 952px; /* Bereit des Div-Elements */
height: 285px; /* Hoehe des Div-Elements */
margin: 0px; /* Aussenabstand */
padding: 0px; /* Innenabstand */
}
#content {
width: 155px; /* Bereit des Div-Elements */
padding: 10px 15px 15px 70px; /* Innenabstand */
float: left; /* Element umfließen lassen - links */
}
#text{
width: 280px; /* Bereit des Div-Elements */
margin: 0px 0px 0px 0px; /* Aussenabstand */
padding: 0px 0px 0px 0px; /* Innenabstand */
}
* html #text{ /* Angabe nur fuer den IE */
margin: 0px 0px 0px 555px;
}
#navi ul{
list-style: square inside; /* Liststyle => Quadrat */
margin: 0px auto; /* Aussenabstand */
padding: 0px; /* Innenabstand */
}
#footer {
background: #ECEBD9 url('images/Design-Footer.jpg') top no-repeat; /* Hintergrundbild das nicht wiederholt wird */
clear: both; /* hebt float: left; wieder auf*/
width: 952px; /* Bereit des Div-Elements */
height: 34px; /* Hoehe des Div-Elements */
margin: 0px auto; /* Aussenabstand */
padding: 0px 0px 0px; /* Innenabstand */
line-height: 36px; /* Zeilenhoehe*/
text-align: center; /* Textausrichtung */
color: #969789; /* Textfarbe */
}
/* Links
--------------------------------------------------------------------------- */
A { /* generelle Formatierung eines Links */
color: #A2B710; /* Textfarbe */
text-decoration: none; /* Definiert das der Link nicht unterstrichen ist */
}
A:visited { /* Besuchter Link */
color: #494833; /* Textfarbe */
text-decoration: underline; /* Definiert dass der Link unterstrichen ist */
}
A:hover, A:active { /* Aktiver Link & wenn man mit der Maus drueber faehrt */
color: #686864; /* Textfarbe */
text-decoration: underline; /* Definiert dass der Link unterstrichen ist */
}
/* headlines
--------------------------------------------------------------------------- */
h1{
color: #75029f; /* Textfarbe */
text-align: left; /* Textausrichtung */
padding: 0 0px 0px 0px; /* Innenabstand */
font: normal 1.6em verdana, tahoma, sans-serif; /* Schriftgroesse und Schriftart */
}
h2{
color: #65666B; /* Textfarbe */
text-align: left; /* Textausrichtung */
padding: 0 5px 0px 5px; /* Innenabstand */
font-size: 1.4em; /* Schriftgroesse */
}
h3{
color: #BA7EBA; /* Textfarbe */
text-align: left; /* Textausrichtung */
padding: 0 5px 5px 5px; /* Innenabstand */
font-size: 1.3em; /* Schriftgroesse */
}Könnt ihr mir sagen was ich falsch mache?:(
