|
|||
html layout in css
hi, leute
wage mich an mein erstes css projekt und steh schon an. ich möchte dieses layout http://www.wiggi-rafting.at/test/htmltest.htm in css hinbekommen. das hab ich in css http://www.wiggi-rafting.at/test/csstest.htm leider stellte sich heraus das es sehr schwierig zu schein scheint den hier bezeichneten "test link" oben beim nicht so hohen bild hinzubekommen. kennt jemand eine Lösung? thx bartenbach |
Sponsored Links |
|
|||
Nabend Bartenbach
Einige Kleinigkeiten vorweg: 1. xml-Prolog zu Beginn ist zwar eigentlich korrekt, lässt den IE jedoch im Quirksmode rendern und somit versteht er das sogenante "Boxmodell" falsch. (die 3 fettgedruckten Begriffe werden in Google gut erklärt ) 2. du hast in CSS die ID "Seite" definiert und unten dann dem Container die ID "seite" zugewiesen. Da musst du auf Groß- und Kleinschreibung achten 3. Stylesheets müssten im <head>-Tag definiert werden und nicht zwischen head-Tag und und bodytag Hab dir mal n kleines Beispiel geschrieben, wie du das machen könntest mit dem Text und den Bilder. Ich weiß jetzt nicht so genau, ob das von der Semantik her das Optimum ist, aber für den Anfang doch ganz passabel 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> <title>Unbenanntes Dokument</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css" > * { margin:0; padding:0 } body { color: black; font: 12px Verdana,Arial,sans-serif; padding: 1em 0; text-align: center; background: blue url(teile/bg.gif); } div#Seite { text-align: left; /* Seiteninhalt wieder links ausrichten */ margin: 0 auto; /* standardkonforme horizontale Zentrierung */ width: 700px; background: #fff url(teile/boarders.gif) repeat-y; } div#headerpics1 { background: url(teile/raft_v.jpg) right top no-repeat; min-height: 230px; } div#headerpix2 {margin:0 auto;} </style> </head> <body> <div id="Seite"> <div id="headerpics1" > [img]teile/raft_h.jpg[/img]</p> test Link</p> </div> </div> </body> </html>
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. << |
Sponsored Links |
|
|||
danke nochmal, hab aber noch eine frage
also das rechte bild machst du als hintergrundbild damit es sich so ausrichten lasst. die bilder sollen sich dann aber bei jeder seite wechseln lassen, und da ich das css auslagern möchte kann ich die lösung nicht ganz verwenden. sorry das ich so lästig bin - wär cool wenn du noch ne lösungsmöglichkeit wissen würdest. thx bartenbach |
|
|||
Zitat:
#version1 #headerpics1 {...} #version2 #headerpics1 {...} Zitat:
Willst du hier fertige Lösungen präsentiert bekommen ohne selbst etwas zu tun? Für dich zur Einarbeitung in CSS: http://www.css4you.de/ http://de.selfhtml.org/css/index.htm http://www.vorsprungdurchwebstandard...trocoding.html http://www.vorsprungdurchwebstandard...scher-code.php Grüße fricca |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
externe CSS Datei in HTML einbinden | simsam | CSS | 5 | 15.03.2010 21:19 |
css layout problem | fz21z | CSS | 0 | 30.01.2008 23:41 |
usemap splitten unter css UND html | thadan | CSS | 1 | 06.01.2008 18:30 |
XML -> HTML mit CSS, erweiterbares layout | tk | CSS | 0 | 29.11.2004 09:41 |
CSS = Bug? : Einfaches Layout nicht möglich? | trequ | CSS | 16 | 14.09.2004 18:06 |