Muskampen 2025: Segraren korad!
Forum Mjukvara Programmering och digitalt skapande Tråd Inlägg

Problem med Css igen, centrering.

1
Skriv svar
Permalänk
Medlem
●

Problem med Css igen, centrering.

Jag vill centrera ett fönster i webbläsaren, men kommer inte särskillt långt då jag inte finner någon möjlig motsvarighet till align="center".
Hela sidan är uppbyggd i endast css-lager.

Visa signatur

www.gejarnet.com

Redigera
Citera flera Citera
Permalänk
Medlem
●

text-align: center; är motsvarigheten till align="center"

Redigera
Citera flera Citera
Permalänk
Medlem
●
.cent 
{ 
   width: 500px; 
   height: 300px; 
   position: absolute; 
   top: 50%; 
   left: 50%; 
   margin-left: -250px; /* halva bredd */ 
   margin-top: -150px; /* halva bredd */ 
}


<div class="cent"></div>
Visa signatur

Sverige är ett så litet land att det bara får plats en åsikt i taget där.

Redigera
Citera flera Citera
Permalänk
Medlem
●
.cent 
{ 
   width: 500px; 
   height: 300px; 
   position: relative; 
}


<center><div class="cent"></div></center>

Iofs går inte denna på höjden.

Visa signatur

Swec @ 2001 / Chalmerist - Javisst!
'Den som har flest prylar när han dör vinner!'

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av Daniel 

.cent 
{ 
   width: 500px; 
   height: 300px; 
   position: absolute; 
   top: 50%; 
   left: 50%; 
   margin-left: -250px; /* halva bredd */ 
   margin-top: -150px; /* halva bredd */ 
}


<div class="cent"></div>

Hur bra som helst! Tack!

Visa signatur

www.gejarnet.com

Redigera
Citera flera Citera
Permalänk
Medlem
●

Iofs går inte denna på höjden.
Det gör inte align="center" heller, så det är rätt så.. även jag slänger in en variant:

* { text-align: left;  /* sätter det på alla element, utom de som blir tillsagda att inte vara det, t.ex. body nedan, annars centreras allt, även text inuti andra element */ }
body { text-align: center; /* för IE, den klarar inte margin: auto */ }
.cent { /* sättet som funkar i en vettig läsare: */
    margin-left: auto;
    margin-right: auto;
}

Det hela beror ju lite på hur du vill ha det. Vill du ha det både i sidled och i höjdled går inte mitt sätt, vill du göra det bara i sidled så funkar mitt.

Visa signatur

Äntligen har jag fått svar på om vandrande pinnar kan gäspa. Det kan de inte. Ett av världens stora mysterier är löst.

Redigera
Citera flera Citera
Permalänk
Medlem
●

vill du få exakt centrering i höjdled ska du kolla här http://www.edgrenweb.se/index.php?sida=css-fff&id=1
fungerar dock inte i IE, så Daniels variant finns också med

Redigera
Citera flera Citera
1
Skriv svar