![]() |
Willkommen, Gast ( Anmelden | Registrierung )
![]() ![]() |
![]() |
![]()
Beitrag
#11
|
|
Kommt Zeit, kommt Rat, kommt Conrad! ![]() Gruppe: Mods Beiträge: 1.169 Mitglied seit: 21.11.2001 Wohnort: Altenkirchen, Westerwald Mitglieds-Nr.: 42 ![]() |
ZITAT(Worgan @ 07.12.2004 - 17:14) ![]() Ja, wenn die Kristalkugel hochglanz poliert sind, schaffen wir es fast zu antworten bevor die Frage gestellt wird. ![]() cu Conny |
|
|
![]()
Beitrag
#12
|
|
looks good Gruppe: User Beiträge: 67 Mitglied seit: 18.01.2004 Wohnort: Karlsruhe Mitglieds-Nr.: 1.896 ![]() |
So weit so gut, ich habe jetzt die Vorschläge von Ede umgesetzt.
Der ie und Opera machen ihre Arbeit gut, lediglich der Firefox verschiebt die Box mit dem Inhalt nach rechts und nach unten. Ich poste noch mal mein aktuelles Coding, vieleicht findet ja jemand von Euch den Fehler. danke schon mal im Voraus. Martin Html: <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content= "text/html; charset=iso-8859-1"> <meta name="language" content="de"> <title> Leistungen </title> <meta name="author" content="Martin"> <meta name="generator" content="Ulli Meybohms HTML EDITOR"> <link rel="stylesheet" href="Style/style_mw.css" type= "text/css"> </head> <body> <div id="seitenformat"> <div id="seitenkopf"> <img src= "../Eventtechnik/www/Grafik/puresound_logo_website_800.gif" width="780" height="102" border="0" alt= "PureSound Logo"> </div> <div id="inhalt"> <br> <br> <br> <a href="index.html">Start</a> <a href="wir.html"> Portrait</a> <a href="angebot.html">Leistungen</a> <a href="news.html">Neues</a> <a href="links.html">Links</a> <a href="kontakt.html">Kontakt</a> <a href="agb.html"> AGB</a> <a href="mailto:info@eventtechnik-weishaupt.de"> Email <img src="../Eventtechnik/brief.gif" width="11" height="9" border="0" alt="Email"></a> <a href= "impressum.html">Impressum</a> <div id="textfeld"> Ich teste jetzt mal den Inhalt </div> </div> <div id="fussbereich"> </div> </div> </body> </html> CSS: body { background-color: #FFA500; width: 100%; height: 100%; text-align: center; margin: 0px 0px 0px 0px; } A:LINK { background-color: transparent; color: white; display: block; width: 130px; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 14px; } A:VISITED { background-color: transparent; color: white; display: block; width: 130px; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 14px; } A:HOVER { background-color: orange; color: black; display: block; width: 130px; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 14px; } A:LINK.untermenue { background-color: smoke white; color: blue; display: block; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 12px; } A:VISITED.untermenue { background-color: silver; color: blue; display: block; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 12px; } A:HOVER.untermenue { background-color: orange; color: black; display: block; text-decoration: none; font-weight: 500; font-size: 11px; font-family: sans-serif; line-height: 12px; } p { background-color: transparent; color: black; text-decoration: none; font-weight: 500; font-size: 12px; font-family: sans-serif; line-height: 13,5px; } h1 { background-color: transparent; color: black; text-decoration: none; font-weight: 600; font-size: 14px; font-family: sans-serif; line-height: 16px; } #seitenformat { z-index: 0; width: 780px; height: auto; position: relative; background-color: transparent; margin-left: auto; margin-right: auto; margin-top: 0px; padding: 0px 0px 0px 0px; margin-bottom: 0px; } #seitenkopf { z-index: 1; width: 780px; height: 100px; position: relative; margin-left: auto; margin-right: auto; margin-top: 0px; padding: 0px 0px 0px 0px; } #inhalt { top: 102px; left: 0px; width: 780 px; background-color: gray; position: absolute; padding-left: 20px; text-align: left; float: left; height: 500px; } #textfeld { top: 0px; height: 500px; width: 630px; background-color: silver; position: absolute; margin-left: 130px; padding-left: 20px; padding-top: 25px; } #fussbereich { z-index: 0; width: 780px; top: 500px; height: 10px; position: relative; margin-left: auto; margin-right: auto; margin-bottom: 0px; padding: 0px 0px 0px 0px; } |
|
|
![]() ![]()
Beitrag
#13
|
|
Ausnahme Poster ![]() Gruppe: User Beiträge: 147 Mitglied seit: 14.07.2003 Wohnort: Schwäbisch Gmünd Mitglieds-Nr.: 947 ![]() |
Hi Martin,
beim besten Willen, da steht viel zu viel unnötiges Zeug drin (position, z-index...) Warum nicht einfach, wenn's umständlich auch geht ![]() Hier mein ganz einfaches Grundgerüst: QUELLTEXT <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Test mit Div-Containern</title> <meta name="author" content="Admin"> <meta name="generator" content="Ulli Meybohms HTML EDITOR"> <style type="text/css"> <!-- .Kopf { background: #0080FF; width:780px; height:100px; } .Content { background: #808080; width:780px; height:400px; } .Text { background: #FFFFFF; margin-left: 200px; height:400px; overflow: auto; } .Navigation { float:left; color:white; } .Footer { background: #0080FF; width:780px; height:100px; overflow: auto; } --> </style> </head> <body> <div class="Kopf"> <h1>Hier ist die Kopfzeile</h1> </div> <div class="Content"> <div class="Navigation"> <p><a href="#">Link1</a></p> <p><a href="#">Link2</a></p> <p><a href="#">Link3</a></p> </div> <div class="Text"> <h2>Textbereich</h2> <p>Hier steht der Text drinne</p> </div> </div> <div class="Footer"> <p>Last but noch least die Fusszeile</p> </div> </body> </html> Das kannst du nun mit notwendigen Attributen erweitern. Ausserdem: Könntest du bitte nur die für die Frage notwendigen CSS-Formatierungen posten und nicht alles andere noch zusätzlich? Macht Hilfestellung nicht gerade einfacher. Ich versteh noch immer nicht, warum du nicht genau das getan hast, was ich geschrieben haben, siehe mein Listing. Hab ich mir halt die Arbeit gemacht und dir das Grundgerüst geliefert ![]() Das wird im Firefox angezeigt, wie gewünscht. Der Beitrag wurde von Ede bearbeitet: 10.12.2004 - 11:29 |
|
|
![]()
Beitrag
#14
|
|
looks good Gruppe: User Beiträge: 67 Mitglied seit: 18.01.2004 Wohnort: Karlsruhe Mitglieds-Nr.: 1.896 ![]() |
![]() Entschuldige bitte die Umstände die ich Dir verursacht habe. Ich habe das Ganze immer gerade nebenher "umgesetzt" und hatte wohl noch den halben Kopf auf meinen Baustellen. ![]() ![]() Danke nochmal. Martin |
|
|
![]()
Beitrag
#15
|
|
Ausnahme Poster ![]() Gruppe: User Beiträge: 147 Mitglied seit: 14.07.2003 Wohnort: Schwäbisch Gmünd Mitglieds-Nr.: 947 ![]() |
Hi Martin,
schön, dass es geklappt hat. Ich habe interessanterweise festgestellt (wenn man/frau die einzelnen div-Container mit Hintergrundfarbe belegt), dass der FireFoxe immer einen vertikalen Abstand einbaut und dieses Verhalten auch mit padding oder margin nicht beeinflußt werden kann (der MS-IE macht das nicht). Erst nach dem Einfügen der Attribute overflow: auto rückt er die Container zusammen. Hab seither immer mit der gleichen Hintergrundfarbe gearbeitet, so dass ich dies nie bemerkt hab. Nur mal als Ergänzung, warum die overflow-Attribute drin sind. |
|
|
Google Bot |
![]()
Beitrag
#
|
![]() Google Ads ![]() |
|
|
|
![]() ![]() |
![]() |
Vereinfachte Darstellung | Aktuelles Datum: 10.07.2025 - 1:54 |