Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „CSS Zentrierung ( "float:center" )“

P

PeetG

Guest

Hi,

ich arbeite mich gerade in CSS ein, Anfänger sozusagen und bin dabei auf folgendes Problem gestoßen.
Die Layout sieht derzeit so aus:


(div-Bereiche farblich unterlegt)

Dieses soll mit float gestaltet werden, links und rechts sind statische Spalten und in der Mitte soll (wenn's geht) dynamisch werden. Jetzt klebt mir aber der mittlere Bereich oben-rechts in der Ecke.
Das blaue/rote Feld soll möglichst den ganzen mittleren Bereich ausfüllen und zentriert sein (die Grafik natürlich auch). Das will und will aber nicht klappen, denn float:center gibt's anscheinend nicht.

Hier der Code dazu:

HTML:
<body><div id="table">

    <div id="head">
       <div class="line">TEXT</div>
    </div>
    
    <div id="right">TEXT</div>
    
    <div id="mid">
        <div id="mid-inside">
            <img src="Buch.gif" />
        </div>
    </div>
    
    <div id="left">TEXT</div>
    
    <div id="foot">
       <div class="line">TEXT</div>
    </div>
    
</div></body>
HTML:
body 
{
    background-color: #FFCC00;
}

#table {
    width: 1152px;
    height: 864px;
    margin:auto;
}

#head {
    background-color:#663399;     /*ändern*/
     border: none;
    padding: 0; 
    margin: 0; 
    width: 100%; 
    margin: auto;
    overflow: auto;
}

#left {
    background-color:#00FF00;
     border: none;
    padding: 0;
    margin: 0;
    width: 200px;
    height: 720px;
    float: left;
    overflow: auto;
}

#mid {
    background-color:#0000FF;
    padding: 0;
    border: none;
    margin: 0 auto;
    float: right;
    overflow: auto;
}
#mid-inside {
    background-color:#FF0000;
    padding: 0;
    border: 1px solid #fc0;
    margin: 20px;
}

img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto 
}

#right {
    background-color:#00FF00;
     border:none;
    width: 200px;
    height:720px;
    float: right;
    overflow: auto;
    margin: 0;
}

#foot {
    background-color:#663399;  
    border:none;
    padding: 0; 
    margin: auto; 
    width: 100%;
    overflow: auto; 
    clear: both; 
}
Was mache ich falsch ? Kann mir da jemand weiterhelfen ?

Grüße Peet
 

MIB101

Noch nicht viel geschrieben

AW: CSS Zentrierung ( "float:center" )

Hey

Ja hast recht, "Float:center;" gibts nicht.
Um DIV-Container zu zentrieren, musst du
" margin: 0 auto; "
eingeben.
Damit müsste es gehen!
 
P

PeetG

Guest

AW: CSS Zentrierung ( "float:center" )

so einfach schein es eben nicht zu sein, denn wenn du genau hinschaust steht das zumindest bei #mid schon drin oder vlt. hab ich auch was drin stehen, was die zentrierung wieder aufhebt ? mir fällt zumindest nichts auf ... ?
 

Doitsu

Aktives Mitglied

AW: CSS Zentrierung ( "float:center" )

Wenn du mit float arbeitest bringt dir margin:auto nix..
Du koenntest mit position:absolute; left/top in % und margin -xx px arbeiten..
 

leohh

CSS verliebt

AW: CSS Zentrierung ( "float:center" )

Wieso soll der mittlere Teil eigentlich zentriert werden...
Wo ist die Logik dahinter, wenn ich mit einem multi-colum layout arbeite, in dem die mittlere spalte immer 100% des zur verfuegung, stehenden Platzes einnehmen soll, diese auch noch mittig zu positionieren..

Erschliesst sich mir gerade nicht so wirklich ...
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.156
Beiträge
2.581.859
Mitglieder
67.222
Neuestes Mitglied
Gregor
Oben