Teknik, hosting & e-handelsløsninger

Svar: (CSS) Hvordan centrere man et DIV?

Chiel Robben — Sun, 05 Sep 2010 14:59:18 GMT

Kasper Gadensgaard:

Chiel Robben:

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.

margin: 0 auto;

er det samme som

margin: 0 auto 0 auto;

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: (CSS) Hvordan centrere man et DIV?

Anonymous — Sun, 05 Sep 2010 14:14:44 GMT

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: (CSS) Hvordan centrere man et DIV?

Kasper — Sun, 05 Sep 2010 06:42:24 GMT

Chiel Robben:

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.

margin: 0 auto;

er det samme som

margin: 0 auto 0 auto;

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: (CSS) Hvordan centrere man et DIV?

Chiel Robben — Sat, 04 Sep 2010 22:40:28 GMT

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:

Svar: (CSS) Hvordan centrere man et DIV?

DesignYOU - Allan Hansen — Sat, 04 Sep 2010 20:30:19 GMT

Mikkel Dusi:

#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: (CSS) Hvordan centrere man et DIV?

Simon_rohde_Nielsen — Sat, 04 Sep 2010 20:17:54 GMT

Er det ikke

margin-left: auto 0px;

martin-rigth: auto 0px;

tro det er noget i den stil

Svar: (CSS) Hvordan centrere man et DIV?

slettet_bruger — Sat, 04 Sep 2010 17:53:49 GMT

Mikkel Dusi:

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: (CSS) Hvordan centrere man et DIV?

Dino — Sat, 04 Sep 2010 17:47:01 GMT

Prøv at rette widht til width

#content {

margin:0 auto;

background:url(content.png);

background-repeat:no-repeat;

height:400px;

widht:600px;

(CSS) Hvordan centrere man et DIV?

Anonymous — Sat, 04 Sep 2010 17:44:27 GMT

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;