|
|||
probleme mit float
hi liebes Forum,
ich habe noch nicht sehr viel Erfahrung mit CSS. Ich bastle gerade an einer Seite und versuche das Design mit CSS zu realisieren. Ich versuche eine Leiste einzubauen die Links einen festen Bereich hat, rechts einen festen Bereich und der Bereich in der Mitte sollte flexibel lang sein. Ungefähr sollte es so aussehen: _________ _______________ ______________________ |Bereich 1 Bereich2 Bereich 3 | ---------- ------------------ ------------------------- Bereich 1 habe ich float: left gesetzt. Bereich 3 habe ich float: right gesetzt. den Bereich in der Mitte habe ich kein float gesetzt. In Firefox zeigt er soweit alles an wie es soll. In IE 6 macht er allerdings einen kleinen Abstand von etwa 5 Pixel zwischen den einzellnen Bereichen. Ich habe schon verschiedene Sachen versucht aber ich finde keine Lösung. Ich hoffe das ihr mir helfen könnt: |
Sponsored Links |
|
|||
Probier mal als erstes
Code:
*{ padding: 0px; margin: 0px; } |
|
|||
Ist vielleicht dieser IE Bug...
|
|
|||
Probier es mal so:
Wenn eh mit Bildern arbeitest setze die div's auf feste breiten Code:
<html> <head> <style> *{ margin: 0px; padding: 0px; } #head{ width: 918px; } #headTopLeft{ background-color: orange; height: 131px; width: 9px; float: left; } #headTopMiddle{ background-color: blue; height: 131px; width: 900px; float: left; } #headTopRight{ background-color: red; width: 9px; height: 131px; float: right; </style> </head> <body> <div id="head"> <div id="headTopLeft"> </div> <div id="headTopRight"> </div> <div id="headTopMiddle"> </div> </div> </body> </html> Geändert von diaz1983 (08.03.2009 um 13:30 Uhr) Grund: screenshot-link vergessen |
|
||||
Hi,
aha, es geht also um runde Ecken. Da würde ich gar nicht floaten. Die Grafiken werden zu HG-Grafiken und können evtl. auch Elementen im Header zugewiesen werden. Schau doch mal hier oder hier.
__________________
Ein mehrfacher Gruß aus dem Südosten Klaus |
|
||||
HTML-Code:
#header-topleft{ background: url(pics/navi_top_left.jpg) no-repeat scroll center top; height: 131px; width: 9px; float: left; } #header-topright{ background: url(pics/navi_top_right.jpg) no-repeat scroll center top; width: 9px; height: 131px; float: right; } #header{ background: url(pics/navi_top_middle.jpg) repeat-x scroll center top; height: 131px; } HTML-Code:
<div id="head"> <div id="headTopLeft"></div> <div id="headTopRight"></div> </div> |
|
|||
Zitat:
Oder sollte ich vieleicht von neu alles machen und anders machen. Das Design soll wenn es fertig sein etwa so aussehen. Allerdings wird bei der Seite sehr viel Wert drauf gelegt, dass die Seite für alle Auflösungen flexibel seien soll, da die Zielgruppe breit vertreten ist. Daher hatte ich mir gedacht einfach die ganze Breite auf 90% zu setzen damit es bei allen Auflösungen gleich breit ist. |
Sponsored Links |
|
||||
Das kann ich jetzt nicht nachvollziehen.
Hier wäre es angebracht an ein Live Beispiel zu denken ... Zumindest wäre Code - den Du verwendest - vorteilhaft, um Dir zu helfen. Besten Gruß |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Float-Problem? | mischaef | CSS | 33 | 20.10.2010 17:20 |
Float - Probleme | wolf1985 | CSS | 5 | 19.08.2008 09:14 |
Mozilla zeigt DIV zu oft an | cracki | CSS | 6 | 09.03.2008 16:22 |
IE zeigt gewisse Texte nicht an | zitronenbaum | CSS | 2 | 16.01.2008 16:25 |
Testcase: float, overflow: hidden; und alte Geckos... | heiko_rs | CSS | 0 | 19.11.2007 22:26 |