zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Problem bei Positionierung einer div Box

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 30.04.2009, 14:47
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.04.2009
Beiträge: 2
Octane befindet sich auf einem aufstrebenden Ast
Frage Problem bei Positionierung einer div Box

Hallo,
bin noch ein neuling in css und habe ein problem mit der position meiner bannerbox.
es ist ein bisschen schwer zu erklären, also wie man unten auf dem screenshot sehen kann, muss die box mit dem roten hintergrund eigentlich auf der position der grünen markierung sein.
und normalerweise muss diese grüne markierung ja an der lilalen markierung "andocken" damit es nicht zu problemen kommt bei verschiedenen auflösungen.

(die größe der roten box ist ja erst mal egal ...geht ja ums "andocken".




ich kommen einfach nicht darauf wie man das realisieren könnte.
die seite kann man unter folgenden url finden:
Strand-paradies.de Hier finden sie Ihre Reise !

die seite hab ich noch für euch falls man es braucht geuppt:
http://oktan.kilu.de/download/Test.rar

Ich hoffe dass man mir helfen kann, hab mich schon durch einige tutorials gestöbert und hab auch schon einiges gelernt ...vor einigen tagen wusste ich nicht mal was css ist ...

danke schon mal im vorraus

mfg octane
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 30.04.2009, 15:01
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.03.2007
Ort: Bad Schmiedeberg
Beiträge: 1.397
regloh wird schon bald berühmt werden
Standard

Zuerst fällt auf, dass dein #wrapper floatende Elemente enthält, aber kein clearendes, was dazu führt, dass #wrapper die Elemente nicht einschließt.

Die Frage ist, warum du überhaupt alle Elemente floatest. Würde dein Design diesen Banner-Div nicht haben, bräuchte keines deiner Hauptcontainer (header, topnavi, bodybox) zu floaten. Also erstmal raus mit diesen floats.

Um das Banner neben #bodybox zu bekommen und nun alles zusammen horizontal zentriert werden soll, dann lege ein weiteres umgebendes Element um den #wrapper, lege #wrapper und #bannerbox (#bannerbox nicht in #wrapper) in dieses neue Element und gib #wrapper und #bannerbox float: left. #bannerbox muss dann mit margin-top noch nach unten verschoben werden.

Edit: Alternativ könntest du auch #bannerbox mit in #wrapper nehmen (so wie es jetzt schon ist), und #bodybox und #bannerbox mittels float: left nebeneinander stellen. Dabei musst du aber bedenken, dass dein #wrapper dann nicht mehr nur 900px breit ist. Da brauchst du dann auch das zusätzliche umgebende Element nicht. Ist vielleicht sogar die sauberere Lösung.

Geändert von regloh (30.04.2009 um 15:09 Uhr)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 30.04.2009, 15:23
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 30.04.2009
Beiträge: 2
Octane befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von regloh Beitrag anzeigen
Zuerst fällt auf, dass dein #wrapper floatende Elemente enthält, aber kein clearendes, was dazu führt, dass #wrapper die Elemente nicht einschließt.

Die Frage ist, warum du überhaupt alle Elemente floatest. Würde dein Design diesen Banner-Div nicht haben, bräuchte keines deiner Hauptcontainer (header, topnavi, bodybox) zu floaten. Also erstmal raus mit diesen floats.
Habe ich mal getan, aber das design war unzumutbar. sry aber da ich in css noch grundkenntnisse habe verstehe ich deine vorgehensweise nicht. durch das floaten sind doch erst die hauptcontainer da, wo sie sein sollten, oder? habe nämlich auch schon vor dem einfügen des banner divs gefloatet.

und ich habe ja noch einen footer. muss nich das "clearend" sein?. habe es schon auf einigen anderen seiten so gesehen.
Mit Zitat antworten
  #4 (permalink)  
Alt 30.04.2009, 15:44
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 14.03.2007
Ort: Bad Schmiedeberg
Beiträge: 1.397
regloh wird schon bald berühmt werden
Standard

Du verstehst float ganz und gar nicht. Float hat sich nichts mit Positionierung zu tun. Wenn ich im Header das float entferne, dann ändert sich am Layout nichts. Wenn ich in der Navi float und display: inline entferne, ändert sich auch nichts.

Wenn ich im #bodybox das float entferne, dann ändert sich natürlich was. Da #bodybox weitere floatende Elemente enthält (was da auch richtig ist), schließt es diese Elemente nicht ein, da du nicht clearst. Da du #bodybox aber float zugewiesen hast, schließt es die enthaltenen Elemente automatisch ein.

Beschäftige dich mit den Grundlagen. Float ist nicht einfach. Ohne, dass du dir die Grundlagen aneignest, wirst du ohne viel fremde Hilfe nicht weiter kommen.

Zitat:
und ich habe ja noch einen footer. muss nich das "clearend" sein?. habe es schon auf einigen anderen seiten so gesehen.
Ich habe keinen Footer gesehen.
Edit: Hab ihn jetzt entdeckt. Für die bodybox würde er sich als clearendes Element eignen. Aber bitte ohne erneutes float.

Geändert von regloh (30.04.2009 um 15:47 Uhr)
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18
problem mit div box im firefox - dringend!! tee CSS 11 27.09.2007 20:21
DIV in DIV BOX party CSS 1 24.08.2007 17:20
Problem mit DIV im DIV (height: 100%) code_pilot CSS 2 20.02.2006 20:33
Div Boxen problem ... Palorux CSS 5 08.08.2005 21:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 20:03 Uhr.