|
|||
Div mit fixem Abstand und variabler Breite
Hallo liebes Forum,
ich bastel derzeit ein wenig an meiner Seite und bin nun auf ein Problem gestossen, zudem ich keine Antwort finde. Hier die Beschreibung: Meine Seite ist in einen linken und einen rechten Teil eingeteilt. Beide divs bestehen aus mehreren Teilen: 1. Der eigentlich div (prozentuale Breite) 70% links 25% rechts jeweils float 2. Ein div für Überschrift mit Hintergrundgrafik innerhalb des 1. divs über die volle Breite 3. Ein div als optischer Trenner abgesetzt. Dieser Div bereitet mir die Probleme, weil ich diesen div gerne mit fixem margin (20px rechts und links) definieren möchte. Die Breite soll quasi automatisch berechnet werden dazwischen und angezeigt werden. Mit width auto funktioniert dies leider nicht. Könnt ihr mir helfen? Ich hoffe, ich habe das Problem verständlich erklärt. Anbei sende ich noch die main.php, die den html-code enthält und das notwendige css. Das div welches ich eingerückt haben möchte heisst div#ContentBorderTop Für Antworten wäre ich euch sehr dankbar. main.php PHP-Code:
Code:
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Beschreibung der einzelnen Typen - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ body { margin:0px; font-family:sans-serif; font-size:11px; text-align:left; color:black; background-color:#090909; } img { border:0px; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Beschreibung der einzelnen Id´s - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* - Richtet das Bild im Banner oben aus - */ img#banner { float:right; border:inherit; } /* - Container für den Banner oben - */ div#banner { width:100%; height:150px; margin:0px; border:0px; } /* - Container für das Hauptmenü unter dem Banner - */ div#mainMenu { width:100%; height:30px; background-image:url('../img/menu_small.png'); background-repeat:repeat-x; } /* - Container für den linken Bereich - */ div#ContentLeftBackground { width:70%; margin:2% 0% 0% 1%; background-color:#8f8f8f; padding:0%; float:left; } /* - Container für den rechten Bereich - */ div#ContentRightBackground { width:23%; margin:2% 1% 0% 0%; background-color:#8f8f8f; padding:0%; float:right; } /* - Container für die Überschrift über dem jeweiligen Bereich - */ div#ContentHeadline { float:inherit; width:100%; height:20px; margin:0%; background-image:url('../img/headline_small.png'); background-repeat:repeat-x; text-align:center; } /* - Container für den Rahmen oberhalb des Inhalts - */ div#ContentBorderTop { float:inherit; width:auto; margin:20px 10px 0px 10px; height:10px; background-color:#760000; border:1px black solid; display:inline; } /* - Container für den Inhalt - */ div#Content { float:inherit; width:100%; margin:0%; background-color:#f1f1f1; border:1px black solid; border-top:0px; } /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Beschreibung der einzelnen Klassen - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .leftScrew { float:left; } .rightScrew { float:right; } |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Fragen zu CSS und Joomla | DOKTOR | CSS | 2 | 23.05.2011 20:29 |
Brauche Hilfe: Schwarzes Nichts | Zwox | CSS | 10 | 19.11.2010 17:53 |
Header entfernen | tripple | CSS | 17 | 15.06.2010 16:41 |
Schriftfarbe in den Eintragungsfeldern von jforms | Steveislucky | CSS | 2 | 16.03.2010 11:59 |
CSS Text nebeinander? | carstiee09 | CSS | 13 | 13.11.2009 20:18 |