css centreren

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

L P

L P

10/04/2008 12:14:00
Quote Anchor link
Ik heb een probleem, mijn website http://basil.computershopmargraten.nl is in Firefox wel gecentreerd maar in IE blijft ie links staan.

Moet ik dit oplossen in het css bestand of in de code van mijn site?
Gewijzigd op 01/01/1970 01:00:00 door L P
 
PHP hulp

PHP hulp

31/12/2024 16:19:28
 
Rein de Vries

Rein de Vries

10/04/2008 12:54:00
Quote Anchor link
<div id="wrapper">
<div id="header></div>

je site gegevens...

<div id="footer></div>
</div>

#wrapper {
margin-left:auto;
margin-right:auto;
}
 
L P

L P

10/04/2008 13:04:00
Quote Anchor link
Dit heb ik nu maar de site blijft toch links staan.

edit:
Bleek niet nodig
Gewijzigd op 01/01/1970 01:00:00 door L P
 
Jesper Diovo

Jesper Diovo

10/04/2008 13:17:00
Quote Anchor link
Post alleen relevante code. Het enige wat wij hier nodig hebben is het stukje stylesheet van #wrapper.
Je moet aan de div #wrapper een margin meegeven. Nl: margin: 0 auto 0 auto;
Margin is opgebouwd als volgt: <top> <right> <bottom> <left>.
Top en bottom moeten 0 zijn, tenminste, in eerste instantie. De div moet automatisch de rechtse en linkse marges krijgen, dus via auto.

Zo wordt de div #wrapper in het midden gezet.

edit: typo.
Gewijzigd op 01/01/1970 01:00:00 door Jesper Diovo
 
L P

L P

10/04/2008 13:29:00
Quote Anchor link
dit is mijn wrapper:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
#wrapper {
    width: 800px;
    min-height: 100%;
    height: 100%;
    margin: 0 auto 0 auto;
    padding: 0;    
    background: url(images/img03.jpg) repeat-y left top;
    margin-left:auto;
    margin-right:auto;
}
 
Jesper Diovo

Jesper Diovo

10/04/2008 13:32:00
Quote Anchor link
Juist, doe daarmee wat ik je vertelde ;-).

Als je eenmaal margin hebt gedefinieerd, hoef je margin-left en margin-right niet meer te definieren. Dit zijn namelijk afsplitsingen voor één bepaalde marge.
Gewijzigd op 01/01/1970 01:00:00 door Jesper Diovo
 
L P

L P

10/04/2008 13:33:00
Quote Anchor link
nu heb ik dus dit:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
#wrapper {
    width: 800px;
    min-height: 100%;
    height: 100%;
    padding: 0;    
    background: url(images/img03.jpg) repeat-y left top;
    margin-top: 0;
    margin-bottom: 0;    
    margin-left: auto;
    margin-right: auto;
}


beter? werkt alleen nog steeds niet
 
Jesper Diovo

Jesper Diovo

10/04/2008 13:34:00
Quote Anchor link
Min-height en height in combinatie zal ook niet echt werken. Als je nu ieder element van margin gaat gebruiken, kun je beter margin in z'n geheel gebruiken.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
margin: 0 auto 0 auto;

ipv
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
margin-top: 0;
margin-bottom: 0;    
margin-left: auto;
margin-right: auto;
 
L P

L P

10/04/2008 13:38:00
Quote Anchor link
goed dan krijg je dus dit:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
#wrapper {
    width: 800px;
    min-height: 100%;
    height: 100%;
    padding: 0;    
    background: url(images/img03.jpg) repeat-y left top;
    margin: 0 auto 0 auto;
}

met nog steeds hetzelfde resultaat
 
Pieter Boussaer

Pieter Boussaer

10/04/2008 15:02:00
Quote Anchor link
Is het voor in IE6,
want in IE7 staat hij bij mij goed.
Als het voor IE6 is moet je in de #wrapper nog text-align: center; zetten
en dan wel bij alle div'jes waar de tekst anders moet uitgelijnd worden op left ofzo zetten

Edit:

Dit moet je toevoegen aan je stylesheet, dit hierboven klopt niet. Ik was mis
body,html
{
text-align: center;
}
Gewijzigd op 01/01/1970 01:00:00 door Pieter Boussaer
 
Jesper Diovo

Jesper Diovo

10/04/2008 15:44:00
Quote Anchor link
Haal die height en min-height er nou eens uit :-P. Eerst een minimale hoogte toekennen en daarna een vaste hoogte toekennen heeft natuurlijk geen zin. Bovendien werkt min-height niet altijd zoals het hoort.
 
GaMer B

GaMer B

10/04/2008 16:03:00
Quote Anchor link
Doe dit in je css:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
body {
    text-align: center; // Voor IE4 and up
}

#wrapper {
    margin: 0 auto;
    text-align: left; // Om de tekst weer te de-centeren
}


Bron: flumpcakes.co.uk
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.