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

hilfe bei layout

Status
Für weitere Antworten geschlossen.
J

jhaustein

Mitglied
hallo gemeinschaft

könnt ihr mir bitte helfen bei dem layout - weiss nicht, wie ich die css erstellen soll, mit dem hintergrund
 

Anhänge

  • test.jpg
    test.jpg
    62,2 KB · Aufrufe: 16
Solche Sachen gehören normalerweiße in die Jobbörse. ^^

Was willst du denn wissen? Was eine CSS-Datei ist? Wie amn sie einbindet? Wie man das komplette Layout, welches in deiner Grafik zu sehen ist, via css erstellt? Oder was ist deine Frage?

So kann man sich zu tote schreiben...definiere es doch wenigstens etwas genauer.

Danke.
 
Endweder selbst machen, oder Jobbörse. Könnte natürlich jetzt den kompletten Code dir schreiben....aber was bringts dir? Du würdest ihn nicht verstehen....und zumal das nicht in 1 Minute gemacht ist.

Hast du dich schonmal mit css-layout beschäftigt?
 
was ist denn hierran falsch - css wird nicht dargestellt

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<style>
html, body{
margin:0;
padding:0;
}

#pagewidth{
max-width:880px;
}

#header{
position:relative;
height:20px;
background-color:#4CEC00;
width:100%;
}

#leftcol{
width:25%;
float:left;
position:relative;
background-color:#FC4300;
}

#maincol{background-color: #FFFFFF;
float: right;
display:inline;
position: relative;
width:;
}

#footer{
height:150px;
background-color:#E3EC00;
clear:both;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */



/*printer styles*/
@media print{
/*hide the left column when printing*/
#leftcol{display:none;}

/*hide the right column when printing*/
#rightcol{display:none;}
#twocols, #maincol{width:100%; float:none;}
}
</style>
</head>
<body>
<div id="pagewidth" >

<div id="header" > Head </div>
<div id="wrapper" class="clearfix" >
<div id="twocols" class="clearfix">

<div id="maincol" > Main Content Column </div>
<div id="rightcol" > right Column </div>
</div>

<div id="leftcol" > Left Column </div>
</div>
<div id="footer" > Footer
</div>
</div>
</body>
</html>
 
ersma, bitte code-tags benutzen;ugl Gerade langer Code ist so ziemlich schwer lesbar und man scrollt sich den Mittelfinger wund:D
ach und Doppelposts sind auch nicht so gern gesehen :) aber da Maxi Urlaub hat und sonst auch kein Mod on ist ...


Dann b2t:
Code: 
<style[COLOR="Red"] type="text/css"[/COLOR]>
...Styleangaben...
</style>

Musst dem Browser ja auch sagen, was für ein Style das ist :)
 
wird der gesamte CSS-Teil nicht angewendet? Gar nichts davon?
Hast du auch die Namen und alles andere richtig?

Edit:
Grad mal ausprobiert, bei mir wird alles angezeigt, FF3!


Dabei hab ich bemerkt, dass <style type="text/css"> gar nicht unbedingt erforderlich ist ;) Jedenfalls nicht im FF!

Edit die Zweite:
Im IE funktionierts bei mir auch wunderbar ...
Keine Ahnung woran es bei dir liegen kann!
 
Zuletzt bearbeitet:
Hmmmmmm ... ich würd gerne noch mehr "m"s machen ... ;ugl

Kann es eventuell sein, dass du die Datei noch im Editor hast und nicht abgespeichert hast ? (Passiert mir manchmal:roll:)
Sonst sehe ich echt keinen Fehler, zumal, siehe Screenshot im vorletzten Beitrag, das bei mir mit deinem Code funktioniert hat ... tut mir leid

Edit:/
Hab jetzt nicht aufs Aussehen geachtet, sondern nur geguckt ob es angezeigt wird, da ich dort das Problem gesehen habe!? Hörte sich für mich so an als ob bei dir einfach nichts angezeigt wird ...
 
bekomme es nur nicht hin mit dem hintergrund wie auf dem bild, welches ich im anhang beigefügt hatte - dass im kopf und der footer so breit werden wie der browser und der mittlere bereich 880 px contentbereich ist (zentriert)
 
Versuche mal
width: 100%; für Footer, Header
beziehungsweise width: 880px; für den Content
oder zeig nochmal deinen neuen Quelltext her :)
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>CssCreator-->HTML 4.01 Strict Template</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />

<meta name="generator" content="www.csscreator.com" />

<style>
html, body{
margin:0;
padding:0;
}

#pagewidth{
max-width:880em;
}

#header{
position:relative;
height:150px;
background-color:#FF89FF;
width:100%;
}

#leftcol{
width:25%;
float:left;
position:relative;
background-color:#837F7F;
}

#maincol{background-color: #FFFFFF;
float: right;
display:inline;
position: relative;
width:;
}

#footer{
height:150px;
background-color:#897F99;
clear:both;
}



/* *** Float containers fix:
http://www.csscreator.com/attributes/containedfloat.php *** */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */



/*printer styles*/
@media print{
/*hide the left column when printing*/
#leftcol{display:none;}

/*hide the right column when printing*/
#rightcol{ width:25%;
float:right;
position:relative;
background-color:#837F7F; }

#twocols, #maincol{width:100%; float:none;}
}
</style>
</head>
<body>
<div id="pagewidth" >

<div id="header" > Head </div>
<div id="wrapper" class="clearfix" >
<div id="twocols" class="clearfix">

<div id="maincol" > Main Content Column </div>
<div id="rightcol" > right Column </div>
</div>

<div id="leftcol" > Left Column </div>
</div>
<div id="footer" > Footer
</div>
</div>
</body>
</html>
 
kaann bitte noch jemand schauen - möchte im kopf einen bereich haben, der so breit ist wie der bildschirm - dann einen inhalt bwereich der 800 breit ist und mittig im browser und unten einen footer der auch übber die breite des browsers geht - kann mir bitte jemand helfen
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben