Centrera en DIV.

HTML & CSS

6 svar · 408 visningar · startad av Fredde Mannen

Medlem sedan nov. 20014 054 inlägg
Trådstart#1

jag vet att man använder sig av margin: auto; för att centrera en div, detta funkar fint på huvudsidan och undersidorna, men i en popup har jag byggt upp en main div så här

<div style="margin: auto;width: 80%;height: 100%;">
Lite innehåll..
</div>

Men här centrerars inte DIVn i Internet Explorer, men funkar bra i Mozilla och Opera, vad kan mitt problem vara?? :q

Eller är bara IE skummdumm?

Medlem sedan nov. 200013 890 inlägg
#2

Kan du inte göra så här:

<body style="text-align: center;">
 <div style="width: 80%; height: 100%;">Lite innehåll..</div>
</body>
Medlem sedan nov. 20014 054 inlägg
#3

Web-Tor skrev:

Kan du inte göra så här:

<body style="text-align: center;">
 <div style="width: 80%; height: 100%;">Lite innehåll..</div>
</body>

Här centrerars ju all text... vill bara att den aktuella diven skall centreras, här måste jag ju börja stoppa en massa extra span eller divs för få texten vänsterställd!

Medlem sedan nov. 20017 144 inlägg
#4
<div align="center" style="margin: auto;width: 80%;height: 100%;">
Lite innehåll..
</div>
Medlem sedan juli 20013 378 inlägg
#5

En annan variant är att köra med absolut positionering till left:50% och sedan fylla p å med en "negativ vänstermarginal" som visas på t.ex. http://bluerobot.com/web/css/center2.html

Medlem sedan juni 2003771 inlägg
#6

Alltså ett exempel på det Jarvklo var inne på.
Så gör jag alltid når jag positionerar.


<html> 
<head> 
<title></title> 
<style type="text/css"> 
<!-- 
body {background-color:green; color:yellow;}
 
div {width:400px; height:250px; position:absolute; left:50%; top:50%; background-color:blue; 
border:3px solid black; margin-left:-200px; margin-top:-125px; } 

<!-- positionerar gör du genom att sätta negativa tal. 
För centrering tar man då hälften av objektets storlek. --> 
i detta fall är diven 400
--> 
</style> 

</head> 
<body > 
<div> 
</div>
</table> 
</body> 
</html>
Medlem sedan nov. 20014 054 inlägg
#7

Jesper T skrev:

<div align="center" style="margin: auto;width: 80%;height: 100%;">
Lite innehåll..
</div>

Denna variant är inte HTML 4.01 Strict!

514 ms totalt · 4 externa anrop · v20260731065814-full.d34c6d5a
130 ms — deklarationer (db)
123 ms — hämta statistik (db)
259 ms — hämta tråd, inlägg och bilagor (db)
130 ms — ändringar (db)