Hov. Du er ikke logget ind.
DU SKAL VÆRE LOGGET IND, FOR AT INTERAGERE PÅ DENNE SIDE

(CSS) Hvordan centrere man et DIV?

Side 1 ud af 1 (9 indlæg)
  • 1
Tilmeldt 20. Apr 07
Indlæg ialt: 16014
30% af profil udfyldt
Skrevet kl. 19:44
Hvor mange stjerner giver du? :

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;

Fra Viby J
Tilmeldt 7. Aug 09
Indlæg ialt: 578
Skrevet kl. 19:47
Hvor mange stjerner giver du? :

Prøv at rette widht til width

 

#content {

margin:0 auto;

background:url(content.png);

background-repeat:no-repeat;

height:400px;

widht:600px;

Tilmeldt 10. Nov 09
Indlæg ialt: 0
Skrevet kl. 19:53
Hvor mange stjerner giver du? :

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.

 

Tilmeldt 1. Jul 10
Indlæg ialt: 45
Skrevet kl. 22:17
Hvor mange stjerner giver du? :

Er det ikke

 

margin-left: auto 0px;

martin-rigth: auto 0px; 

 

tro det er noget i den stil

Fra Puerto De La Duquesa
Tilmeldt 13. Jul 09
Indlæg ialt: 3506
Fra  DesignYOU - Kreative løsninger Skrevet kl. 22:30
Hvor mange stjerner giver du? :

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;

}

Fra København
Tilmeldt 25. May 09
Indlæg ialt: 116
Skrevet kl. 00:40
Hvor mange stjerner giver du? :

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>

Modtag tidsbestillinger på din hjemmeside med Zapla - bookingsystemet virker på alle hjemmesider og tilpasser sig automatisk dit design.

Tilmeldt 28. Sep 07
Indlæg ialt: 1312
Skrevet kl. 08:42
Hvor mange stjerner giver du? :

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;

Tilmeldt 20. Apr 07
Indlæg ialt: 16014
30% af profil udfyldt
Skrevet kl. 16:14
Hvor mange stjerner giver du? :

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

Fra København
Tilmeldt 25. May 09
Indlæg ialt: 116
Skrevet kl. 16:59
Hvor mange stjerner giver du? :

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;

Modtag tidsbestillinger på din hjemmeside med Zapla - bookingsystemet virker på alle hjemmesider og tilpasser sig automatisk dit design.

Side 1 ud af 1 (9 indlæg)