1. #1
    *Rebellion*'s Avatar
    Registered
    19/04/03
    Location
    Moorsel - Aalst
    Posts
    144
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0

    html: table centeren

    ok, we hebben een eindwerk... bedoeling is om een website te maken...

    allemaal goed en wel...alles verloopt goed...maar...we zitten dus met een tabel op onze pagina. Die is centered (in IE) toch. Maar netscape positioneert deze tabel gewoon in de linkerbovenhoek. Volgens w3c zou de css property

    text-align:center;
    vertical-align:middle;

    moeten werken...

    maar da is dus nie zo...

    weet iemand hoe dit komt? (het moet wel strict valid blijven natuurlijk!)
    Fat Wreck Chords
    no votes  

  2. #2
    xeox's Avatar
    Registered
    07/12/03
    Location
    msp \ stabroek
    Posts
    35
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    je hebt volgens mij de sticky niet gelezen

    Horizontaal en verticaal centeren van zaken
    * width en height zijn de hoogte en breedte van het te centreren element
    * margins > de helft van voorgaande waardes
    CSS-file:
    Code:
    .gecentreerd
    {
    position:absolute;
    left:50%;
    top:50%;
    width:498px;
    height:164px;
    margin-left:-249px;
    margin-top:-82px;
    background-color:none;
    }
    HTML:
    Code:
    ...
    <body>
    <div class='gecentreerd'>
    <img ... >
    </div>
    </body>
    ...
    Groeten
    xeox
    __/_xeox.be
    "Only two things are infinite, the universe and human stupidity, and I'm not sure about the former."
    no votes  

  3. #3
    *Rebellion*'s Avatar
    Registered
    19/04/03
    Location
    Moorsel - Aalst
    Posts
    144
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    erm nee toch niet...

    want op die manier ga je de linkerbovenhoek van de tabel op 50% zetten van de bovenkant en op 50% van de linkerkant...m.a.w. de linkerbovenhoek staat in het midden van je scherm...

    position:absolute;
    left:50%;
    top:50%;

    ==> foute manier...

    het middelpunt van de tabel zou in het midden moet staan...
    Fat Wreck Chords
    no votes  

  4. #4
    LunchBox's Avatar
    Registered
    18/07/02
    Location
    Deurne
    Posts
    3,854
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    14/14
    daarbij nog:

    margin-left:-XXpx;
    margin-top:-YYpx;

    waarbij XX = helft van de breedte
    waarbij YY = helft van de hoogte
    *min-teken laten staan uiteraard

    kortom letterlijk overnemen, geen dingen vergeten.
    no votes  

  5. #5
    *Rebellion*'s Avatar
    Registered
    19/04/03
    Location
    Moorsel - Aalst
    Posts
    144
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    mah als ge met andere resoluties gaat beginnen werken dan gaat da niemeer overeenkomen eh...

    da is toch als ge vaste waardes gebruikt (.... px; )
    Fat Wreck Chords
    no votes  

  6. #6
    WiCk3y's Avatar
    Registered
    29/04/04
    Location
    Merksem
    Posts
    426
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    kunde da ni vervangen door % ?
    no votes  

  7. #7
    Dece's Avatar
    Registered
    25/10/02
    Location
    Ninove
    Posts
    829
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    kdenk niet dat ge begrijpt wa het doet!
    ge maakt een div welke je van de linkerhoek positioneerd. (left: 50%; ) deze procentuele waarden zorgen ervoor dat alles er hetzelfde uitzien op alle resoluties.

    nadien trek je er de helft van de div aan af dus margin-left: -(width/2); --> hierdoor ga je dus de div x-aantal pixels opschuiven naar links. dit is een vaste waarde nl deze van u div. we hebben hier dus te maken met een vaste correctie factor -> in px.



    BTW: text-align is bedoeld om de TEKST te positioneren, niet het element zelf(vandaar dat netscape dit niet doet)
    no votes  

  8. #8

    Registered
    03/09/03
    Posts
    78
    iTrader
    0
    Mentioned
    0 Post(s)
    Ok, merci da werk perfect.

    Ik had daar nog nen table rondstaan en ik had naar die table verwezen ipv van de table met de inhoud.(gewoon buitenste table weg laten)

    enorm bedankt:
    xeox voor de code
    Dece voor de toelichting
    no votes  

  9. #9
    BertG's Avatar
    Registered
    03/07/03
    Location
    Heverlee
    Posts
    512
    iTrader
    2 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    ik gebruik altijd deze:

    margin-left: auto;
    margin-right: auto;

    werkt perfect!
    no votes  

  10. #10

    Registered
    18/11/02
    Location
    Eke, Belgiƫ
    Posts
    2,448
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Dat centreert je tabel enkel horizontaal... terwijl het hier zowel horizontaal als verticaal moet zijn... next time read the topic
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in