(CSS) Hvordan centrere man et DIV?
Tilmeldt 20. Apr 07
Slettet bruger
Skrevet
04-09-2010 kl. 19:44
Hvor mange stjerner giver du? :
Svar
Hej teknik-aminoer!
Jeg er endnu en gang stødt ind i problemet af centrering af DIV's. Nu kan jeg ikke huske hvordan man gør det.
Nogle forslag? CSS ser således ud; content skal centreres (content er placeret inde i "Top-div'en" i html , hvis det gør nogen forskel.
body {
text-align:center;
margin:0 auto;
padding:0;
height:100%;
background:#f4ffff;
}
#top {
width:100%;
background:url (bg.png);
background-repeat:repeat-x;
height:400px;
}
#content {
margin:0 auto;
background:url(content.png);
background-repeat:no-repeat;
height:400px;
widht:600px;
Svar
Fra Viby J
Tilmeldt 7. Aug 09
Dino
Skrevet
04-09-2010 kl. 19:47
Hvor mange stjerner giver du? :
Svar
Prøv at rette widht til widt h
#content {
margin:0 auto;
background:url(content.png);
background-repeat:no-repeat;
height:400px;
widh t:600px;
Svar
Tilmeldt 10. Nov 09
slettet_bruger
Skrevet
04-09-2010 kl. 19:53
Hvor mange stjerner giver du? :
Svar
Hej teknik-aminoer!
Jeg er endnu en gang stødt ind i problemet af centrering af DIV's. Nu kan jeg ikke huske hvordan man gør det.
Nogle forslag? CSS ser således ud; content skal centreres (content er placeret inde i "Top-div'en" i html, hvis det gør nogen forskel.
body {
text-align:center;
margin:0 auto;
padding:0;
height:100%;
background:#f4ffff;
}
#top {
width:100%;
background:url(bg.png);
background-repeat:repeat-x;
height:400px;
}
#content {
margin:0 auto;
background:url(content.png);
background-repeat:no-repeat;
height:400px;
widht:600px;
Ja uden stavefejl, så burde det virke! Jeg har lige brugt samme princip på www.liv-i-toreby.dk , dog kun med "margin : 0 auto" på content div'en.
Svar
Tilmeldt 1. Jul 10
Er det ikke
margin-left: auto 0px;
martin-rigth: auto 0px;
tro det er noget i den stil
Svar
Fra Puerto De La Duquesa
Tilmeldt 13. Jul 09
#top {
width:100%;
background:url(bg.png);
background-repeat:repeat-x;
height:400px;
}
#top {
width:100%;
text-align:center;
margin:0 auto;
background:url(bg.png);
background-repeat:repeat-x;
height:400px;
}
Svar
Fra København
Tilmeldt 25. May 09
Chiel Robben
Skrevet
05-09-2010 kl. 00:40
Hvor mange stjerner giver du? :
Svar
For at centrere en div skal den have en fast width, dvs. i px, hvorefter du bruger margin: 0 auto; (som er det samme som margin-left: 0 auto; margin-right: 0 auto;). Hvis du bruger #top som wrapper-div, dvs. den som som alt dit content ligger i, så skal det se således ud:
CSS-koden:
body { text-align: center; } #top { margin: 0 auto; width: 960px; } #content { width: 960px; }
HTML-koden:
<html> <head> </head> <body> <div id="top"> <div id="content"> </div> </div> </body> </html>
Svar
Modtag tidsbestillinger på din hjemmeside med Zapla - bookingsystemet virker på alle hjemmesider og tilpasser sig automatisk dit design.
Tilmeldt 28. Sep 07
Kasper
Skrevet
05-09-2010 kl. 08:42
Hvor mange stjerner giver du? :
Svar
margin: 0 auto; (som er det samme som margin-left: 0 auto; margin-right: 0 auto;).
Det er vist en generel misforståelse blandt mange af jer.
er det samme som
eller
margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;
Der er ikke noget der hedder
margin-left: 0 auto; margin-right: 0 auto;
Svar
Tilmeldt 20. Apr 07
Slettet bruger
Skrevet
05-09-2010 kl. 16:14
Hvor mange stjerner giver du? :
Svar
Jeg siger tak for de mange besvarelser og forsøger at ordne det så snart jeg får tid :-)
Jeg vil skrive igen på tråden, hvis ingen af ovenstående løsninger giver resultat.
Mvh Mikkel Dusi
Svar
Fra København
Tilmeldt 25. May 09
Chiel Robben
Skrevet
05-09-2010 kl. 16:59
Hvor mange stjerner giver du? :
Svar
margin: 0 auto; (som er det samme som margin-left: 0 auto; margin-right: 0 auto;).
Det er vist en generel misforståelse blandt mange af jer.
er det samme som
eller
margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;
Der er ikke noget der hedder
margin-left: 0 auto; margin-right: 0 auto;
Nå ja, det har du da egentlig ret i. Jeg bruger aldrig margin-left, margin-right osv., men short notation af margin, dvs.: margin: top right bottom left;
Svar
Modtag tidsbestillinger på din hjemmeside med Zapla - bookingsystemet virker på alle hjemmesider og tilpasser sig automatisk dit design.