Seite 1 von 2 12 LetzteLetzte
Ergebnis 1 bis 10 von 14

Thema: Hilfe benötigt .. Div Container

  1. #1
    HTML Newbie
    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Hilfe benötigt .. Div Container

    Hi...
    Ich bastel jetzt schon seit gestern an folgenden Problem rum. Ich würde gerne meine Internetseite: www.wunschmode.net in div container umbauen. Doch irgendwie bekomme ich die Seitentruktur nicht so hin wie ich möchte. Vielleicht kann mir einer von euch helfen.

    Folgendes habe ich schon gemacht, aber der div Container # content will einfach nicht da hin wo er soll mit dem hintergrundbild (siehe wunschmode.net).

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http&#58;//www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Layout 36</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta name="generator" content="HAPedit 3.1">
    
    
    <style type="text/css">
    
    html,body&#123;margin&#58;0;padding&#58;0&#125;
    
    body&#123;font&#58; 76% arial,sans-serif;text-align&#58;center&#125;
    
    p&#123;margin&#58;0 10px 10px&#125;
    
    a&#123;display&#58;block;color&#58; #981793;padding&#58;10px&#125;
    
    div#header
    &#123;
    background-image&#58; url&#40;bilder/bg_kopf.jpg&#41;;
    width&#58;800px;height&#58;70px;
    padding&#58;20px;
    &#125;
    
    
    
    div#container&#123;text-align&#58;left&#125;
    div#content p&#123;line-height&#58;1.4&#125;
    div#navigation&#123;background&#58;#9B9A98&#125;
    div#footer&#123;background&#58; #333;color&#58; #FFF&#125;
    div#footer p&#123;margin&#58;0;padding&#58;5px 10px&#125;
    
    div#container&#123;width&#58;700px;margin&#58;0 auto&#125;
    div#content&#123;float&#58;right;width&#58;500px;background-image&#58; url&#40;bilder/bg_home.jpg&#41;;&#125;
    div#navigation&#123;float&#58;left;width&#58;160px;height&#58;100%&#125;
    div#footer&#123;clear&#58;both;width&#58;840px&#125;
    </style>
    
    
    
    
    </head>
    <body>
    <div id="container">
    
    <div id="header">
    div-Container mit Hintergrundbild
    </div>
    
    <div id="wrapper">
    <div id="content">
    
    
    1&#41; Content here. column long long column very long fill fill fill long text text column text silly very make long very fill silly make make long make text fill very long text column silly silly very column long very column filler fill long make filler long silly very long silly silly silly long filler make column filler make silly long long fill very.</p>
    
    
    very make make fill silly long long filler column long make silly silly column filler fill fill very filler text fill filler column make fill make text very make make very fill fill long make very filler column very long very filler silly very make filler silly make make column column </p>
    
    
    fill long make long text very make long fill column make text very silly column filler silly text fill text filler filler filler make make make make text filler fill column filler make silly make text text fill make very filler column very </p>
    
    
    column text long column make silly long text filler silly very very very long filler fill very fill silly very make make filler text filler text make silly text text long fill fill make text fill long text very silly long long filler filler fill silly long make column make silly long column long make very </p>
    </div>
    </div>
    <div id="navigation">
    
    
    
    
    					Startseite</p>
    				
    
    Die Produkte</p>
    				
    
    Termin vereinbaren</p>
    				
    
    Jobs zu vergeben</p>
    				
    
    Kontakt</p>
    				
    
    Impressum</p>
    				
    
    Downloads</p>
    				
    
    Newsletter</p>
    				
    
    Kundenlogin</p>
    			</div>
    <div id="footer">
    
    Here it goes the footer</p></div>
    </div>
    </body>
    </html>
    Ich würde mich sehr über eine hilfestellung freuen.
    Lieben gruss aus München
    Ralf
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Prinz(essin) Avatar von Lizzard
    Registriert seit
    19.02.2006
    Ort
    München
    Beiträge
    788
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    dein Div "wrapper" hat keinerlei Klasseninformation...

    Einen Moment, ich bau dir das Layout schnell um.
    Sometimes you have a programming problem and it seems like the best solution is to use regular expressions; now you have two problems.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Das ist ganz lieb von dir bin jetzt schon seit mehr als 24h wach und am rumbasteln

  4. #4
    Prinz(essin) Avatar von Lizzard
    Registriert seit
    19.02.2006
    Ort
    München
    Beiträge
    788
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Ganz so lang hab ich zum Glück nicht gebraucht jetzt

    Hab ein neues Bild erstellt für den Hintergrund, hab dir den ganzen benötigten Bildordner angehängt.

    Hier der Code für die Seite:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http&#58;//www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Wunschmode.net</title>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta name="generator" content="LizZard &#58;D">
    
    
    <style type="text/css">
    
    body &#123;
    
    	margin&#58; 0;
    	padding&#58; 0;
    	background&#58; #FFFFFF url&#40;bilder/bg_rechts.jpg&#41;;
    	font-family&#58; Arial, verdana, sans-serif;
    	font-size&#58; 0.9em;
    	color&#58; #B0211D;
    &#125;
    
    #header &#123;
    	
    	margin&#58; 0 auto;
    	margin-top&#58; 10px;
    	width&#58; 800px;
    	height&#58; 100px;
    	background&#58; #FFFFFF url&#40;bilder/bg_kopf.jpg&#41;;
    &#125;
    
    #header h1, #header h2 &#123;
    	
    	display&#58; none;
    &#125;
    
    #container &#123;
    
    	margin&#58; 0 auto;
    	width&#58; 800px;
    	border-top&#58; 2px solid #9B9A98;
    	background&#58; #9B9A98 url&#40;bilder/main_bg.gif&#41; repeat-y;
    &#125;
    
    #content &#123;
    
    	width&#58; 638px;
    	padding&#58; 6px;
    	float&#58; right;
    &#125;
    
    #navigation &#123;
    
    	margin&#58; 15px;
    	padding&#58; 0;
    	width&#58; 120px;
    	list-style-type&#58; none;
    	float&#58; left;
    &#125;
    #navigation li &#123;
    	
    	padding&#58; 2px;
    &#125;
    
    a &#123;
    
    	color&#58; #B0211D;
    	text-decoration&#58; underline;
    &#125;
    a&#58;visited &#123;
    
    	text-decoration&#58; none;
    &#125;
    a&#58;hover, a&#58;focus &#123;
    
    	text-decoration&#58; underline;
    &#125;
    	
    #footer &#123;
    	
    	margin&#58; 0 auto;
    	width&#58; 640px;
    	background&#58; #FFFFFF url&#40;bilder/bg_gesamt.gif&#41;;
    	clear&#58; both;
    	border-top&#58; 2px solid #9B9A98;
    	padding-left&#58; 160px;
    &#125;
    
    #footer p &#123;
    
    	margin&#58; 0;
    	padding&#58; 2px;
    	color&#58; #FFFFFF;
    	font-size&#58; 0.7em;
    &#125;		 
    
    </style>
    
    
    
    
    </head>
    <body>
    
    <div id="header">
    	<h1>Wunschmode.net</h1>
    	<h2>Josephstraße 5, 80798 München, Fon&#58; 288077 -11</h2>
    </div>
    
    <div id="container">
    	<div id="content">
    		
    
    
    			1&#41; Content here. column long long column very long fill fill fill long text text column text silly very make long very fill silly make make long make text fill very long text column silly silly very column long very column filler fill long make filler long silly very long silly silly silly long filler make column filler make silly long long fill very.
    		</p>
    		
    
    
    			very make make fill silly long long filler column long make silly silly column filler fill fill very filler text fill filler column make fill make text very make make very fill fill long make very filler column very long very filler silly very make filler silly make make column column 
    		</p>
    		
    
    
    			fill long make long text very make long fill column make text very silly column filler silly text fill text filler filler filler make make make make text filler fill column filler make silly make text text fill make very filler column very 
    		</p>
    		
    
    
    			column text long column make silly long text filler silly very very very long filler fill very fill silly very make make filler text filler text make silly text text long fill fill make text fill long text very silly long long filler filler fill silly long make column make silly long column long make very 
    		</p>
    
    	</div>
    	<ul id="navigation">
    		[*]Startseite
                	[*]Die Produkte
                	[*]Termin vereinbaren
                	[*]Jobs zu vergeben
                	[*]Kontakt
                	[*]Impressum
                	[*]Downloads
                	[*]Newsletter
                	[*]Kundenlogin[/list]
    	 <br style="clear&#58; both;" />
    </div>
    <div id="footer">
    	
    
    
    		Here goes the footer
    	</p>
    </div>
    
    </body>
    </html>
    funktioniert in allen gängigen Browsern.
    Content verlängert sich durch Faux Columns schön nach unten, und auch der Footer kann wie bisher mit Inhalt gefüllt werden. Auch wenn ich es bevorzugen würde, den Content nicht in den schwarzen Bereich zu schreiben, sondern "im weißen zu bleiben".

    Optimal wär noch eine Auslagerung des CSS in eine externe Datei.
    Deine Content-Hintegründe müssen dann entsprechend in das #content - Div. Allerdings würde ich weniger Schrift in die Bilder packen, und mehr Text verwenden! (Besser für Suchmaschinen)

    Falls dir der Code maßgebilch geholfen, und dir Arbeit gespart hat, könntest du ja als Dank einen Link auf meine Seite setzen

    Grüße,
    LizZard
    Angehängte Dateien Angehängte Dateien
    Sometimes you have a programming problem and it seems like the best solution is to use regular expressions; now you have two problems.

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Super Danke ... ich werd das gleich mal ausprobieren. Melde mich dann gleich nochmal. Und ein Link setzte ich dir dann sehr gerne !!

  6. #6
    Prinz(essin) Avatar von Lizzard
    Registriert seit
    19.02.2006
    Ort
    München
    Beiträge
    788
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hab mir erlaubt, deine Seite zu zentrieren, wenn du sie wieder am Rand haben willst, musst du nur das "auto" in den margin: 0 auto; -Attributen entfernen.
    Sometimes you have a programming problem and it seems like the best solution is to use regular expressions; now you have two problems.

  7. #7
    HTML Newbie
    Themenstarter

    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Ne zentriert ist super.
    Also sieht super aus, genau so wie ich es haben wollte *freu* und ich hab mehr als 24h für das nicht fertige Gerüst gebraucht. Wie man alles ändert weiss ich ja ungefähr Also der link auf der Startseite ist dir sicher ^^ Danke dir nochmal

  8. #8
    Prinz(essin) Avatar von Lizzard
    Registriert seit
    19.02.2006
    Ort
    München
    Beiträge
    788
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Gern geschehen, und Danke für den Link
    Sometimes you have a programming problem and it seems like the best solution is to use regular expressions; now you have two problems.

  9. #9
    HTML Newbie
    Themenstarter

    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ok letzte sache noch das hintergrundbild mit dem Anzug wie packe ich das jetzt am geschicktesten da rein? Rest müsste ich dann wissen

  10. #10
    HTML Newbie
    Themenstarter

    Registriert seit
    09.04.2007
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ok hab es schon ^^ Ich sollte wohl mal schlafen gehen

Ähnliche Themen

  1. Drigend Hilfe benötigt bei Mac Installation
    Von kunulo im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 12
    Letzter Beitrag: 21.01.2008, 07:52
  2. Hilfe benötigt dringend
    Von Angelcr im Forum Computer - Internet Forum
    Antworten: 1
    Letzter Beitrag: 26.11.2007, 21:15
  3. Hilfe benötigt
    Von Neoaxizz im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 04.08.2007, 22:37
  4. Hilfe für Direktlink benötigt...
    Von MØBLER im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 29.09.2005, 13:21
  5. Hilfe bei Homepagebau benötigt
    Von y.FuL im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 02.10.2004, 16:31

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •