Autor |
Nachricht |
nicole.kowalski
Threadersteller
Dabei seit: 01.04.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 02.04.2009 13:15
Titel (css) Div akzeptiert kein float right |
|
|
Hi Leute,
Folgendermaßen schaut das Layout aus:
Großer Div-Container, der alles beinhaltet und zentriert ist.
Headbereich
Hauptmenü
Submenü
drei nebeneinander stehende Divs (background_left ((der auch float left hat)), text und sidebar ((mit float left)))
Footer
Die Sidebar (rechter Div) klebt aber mit ihrer linken oberen Ecke an der rechten unteren Ecke vom Div text.
Sprich die beiden Divs background_left und text scheinen sie zu verdrängen.
Hier mein Css Schnipsel:
Code: |
body {
font-size: 100.01%;
font-family: Verdana,Arial,sans-serif;
background-color:#fefcf2;
padding:0;
margin:0;
}
/* -----------------Gesamtes Layout--------------------- */
#layout {
width: 995px;
margin: 0 auto;
background-image:url(../images/body_fuellbild.jpg);
background-position: top center;
background-repeat: repeat-y;}
/* ----------Bannerbereich für das Logo-------------- */
div#header {
text-align: left;
width: 995px;
height: 105px;
background-image:url(../images/layout_header.jpg);
background-position: top left ;
background-repeat: no-repeat;}
.transparent /*Link zu Home auf dem Banner */
{ width: 280px;
height:45px;
margin-top:20px;
margin-left:20px;
border: 0;}
/* ----------Hauptnavigation-------------- */
Aus Buttons aufgebaut ...
/* -----------------Subnavigation--------------------- */
.subnavi{
width:995px;
height:20px;
text-align: right;
line-height: 120%;
font-size:0.7em;
float:left;
margin:0;
padding-top:2px;}
/* --------------linker Bereich mit Säule------------- */
#background_left {
float: left;
width: 320px;
margin: 0;
padding:0;
}
/* --------------rechter Bereich mit News und Events------------- */
div #sidebar {
text-align: left;
width: 166px;
background-color:#e9edf0;
margin:0;
float:right;}
/* -----------Inhaltsbereich-------------------------------------------------------------------- */
/* -----------Fließtext und Links im Fließtext--------------------------- */
div #text{
width: 385px;
font-size:0.7em;
line-height:130%;
margin-top:22px;
margin-left: 320px;
padding-top:45px;
padding-bottom:35px;
padding-left:20px;
border:1px solid blue;
}
/* -----------footer--------------------------- */
div#footer {
text-align: left;
width: 995px;
height: 27px;
clear:both;
background-image:url(../images/layout_footer.jpg);
background-position: top left;
background-repeat: no-repeat;
margin:0;
background-color:#fefcf2;}
|
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Do 02.04.2009 13:48
Titel
|
|
|
zeig mal bitte ein onlinebsp und dein HTML Markup
|
|
|
|
|
Anzeige
|
|
|
nicole.kowalski
Threadersteller
Dabei seit: 01.04.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 02.04.2009 14:29
Titel hi |
|
|
die Seite wird mit Typo 3 gepflegt. ich schau mal was sich machen lässt. Aber die lokale Version kann ich natürlich mit Typo 3 nicht hochladen, sie funzt ja noch nicht.
Die (mit css noch zu verschachtelte und mit fixer Div größe versehene) aktuell online Version ist.
http://www.prinzengarde-muenster.org/
|
|
|
|
|
willshedo
Dabei seit: 21.12.2005
Ort: Waldshut
Alter: 51
Geschlecht: -
|
Verfasst So 05.04.2009 00:35
Titel
|
|
|
Hi,
ganz spontan:
dein Aussencontainer ist 995 px breit, die drei nebeneinander 320, 166 und 385px, macht zusammen 871. Der div#text hat aber noch nen Aussenrand margin-left:320px. Der wird dazuaddiert und so passt der #text nicht mehr in die Breite und rutscht nach unten.
Ausprobieren...
Schönen Sonntag!
Chris
|
|
|
|
|
traumgaertner
Dabei seit: 18.01.2009
Ort: Franken
Alter: 43
Geschlecht:
|
Verfasst So 05.04.2009 02:46
Titel
|
|
|
Stimme willshedo zu!
Allerdings fehlt die HTML dazu, und somit die Verschachtelung der Container. Geringe, aber mögliche, Fehlerquelle. Gerade dann wenn ein Template benutzt wurde - da sind nämlich häufig auch in den PHP´s CSS-Angaben versteckt. Aber das nur zur Sicherheit - ich denke auch dass willshedo´s Ansatz erfolgversprechend sein dürfte.
|
|
|
|
|
nicole.kowalski
Threadersteller
Dabei seit: 01.04.2008
Ort: -
Alter: -
Geschlecht: -
|
|
|
|
|
nicole.kowalski
Threadersteller
Dabei seit: 01.04.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 06.04.2009 15:43
Titel Lösung gefunden! |
|
|
hi, hab das problem gelöst!
es lag nicht am margin, sondern daran, dass die anordnung im HTML so aussehen muss:
linkes div, rechtes div, mittleres div
total unlogisch eigentlich...aber geht jetzt.
linkes floatet links, rechtes rechts, mittleres gar nicht.
|
|
|
|
|
ApfelQFeierabend
Dabei seit: 05.04.2008
Ort: Regensburg
Alter: 37
Geschlecht:
|
Verfasst Mo 06.04.2009 21:06
Titel
|
|
|
und warum hast du nicht einfach alle 3 divs nacheinander, in der richtigen reihenflolge, float:lefted ^^ ?
|
|
|
|
|
|
|
|
Ähnliche Themen |
Hilfe: div float / width:100% - CSS float Box Model
CSS: Warum werden die globalen Definitionen nicht akzeptiert
Shop akzeptiert keine xxxx@xxx.xxx.xx eMail Adressen.
div und float
<tr> Float in IE7
[css] IE und float
|
|