10 svar · 595 visningar · startad av Prime_66
Hur skriver man för att centrera ett lager? Måste ju gå..
A div: <div id="minDiv"><p>Text</p>
Normal:
#minDiv{
width:70%;
margin: 0 auto;
}
Absolute:
#minDiv {
position: absolute;
width: 400px; height: 200px;
top: 50%; left: 50%;
margin: -100px 0 0 -200px;
}
Fixed:
#minDiv {
position: fixed;
width: 400px; height: 200px;
top: 50%; left: 50%;
margin: -100px 0 0 -200px;
}
position:static; tror jag dock inte fungerar i IE..
ett annat enkelt ex .. har testat i FF hittils
<style type="text/css">
head, body { margin:0; padding:0; height:100%; width:100%; }
div.main { margin-left:auto; margin-right:auto; width:500px; background-color:#069;}
</style>
o ha class="main" på din div
sl0k skrev:
position:static; tror jag dock inte fungerar i IE..
ett annat enkelt ex .. har testat i FF hittils
<style type="text/css"> head, body { margin:0; padding:0; height:100%; width:100%; } div.main { margin-left:auto; margin-right:auto; width:500px; background-color:#069;} </style>o ha class="main" på din div
Det är exakt samma sätt som jag har skrivit ovan, fast du använder onödigt många properties.
Och nä, fixed funkar inte i IE, men det står för IE och inte CSS.
"Static" och "normal" är samma. Det initiala värdet för 'position' är static. 'top' och 'left' gäller endast för positionerade element (inte position:static). Sist jag kollade har IE6 bra stöd för position:static. :)
<html>
<head>
<title></title>
<style type="text/css">
<!--
body {background-color:green; color:yellow;}
div {width:500px; height:350px; position:absolute; left:50%; top:50%; background-color:blue;
margin-left:-250px; margin-top:-175px; }
-->
</style>
</head>
<body >
<div>
Ändra divens bredd o höjd till önskat mått. <br>
Du ändrar sedan värden för margin-left/margin-top enl. följande <br>
Om din div är 300px bred och 200px hög så blir margin-värdena <br>
minus 150px respektive minus 100px. <br>
Dvs hälften av divens mått, fast negativa. <br>
Diven ligger då alltid i mitten oavsett fönsterstorlek eller upplösning.<br>
</div>
</body>
</html>
Tackar!
Hmm..bosse. Om man tar din kod. Jag har ett par input texts i lagret med. Med din kod så syns inte dessa?? Skumt
Allt som du lägger i lagret skall synas, alltså mellan [HTML]
<DIV> och </DIV>[/HTML]
Funkar det inte så får du väl visa din kod här.
Hej. Jag fick göra som så att jag la ett lager till i lagret. För som du skrev det gömmer marginalerna en del av det som finns i lagret som css-en anger. Fast skumt nog gäller detta bara form-objekt. Men som sagt så löste jag det hela genom:
<div id="layer1">
<div id="layer2">
<form> </form>
</div>
</div>
Prime_66 skrev:
Hej. Jag fick göra som så att jag la ett lager till i lagret. För som du skrev det gömmer marginalerna en del av det som finns i lagret som css-en anger. Fast skumt nog gäller detta bara form-objekt. Men som sagt så löste jag det hela genom:
<div id="layer1">
<div id="layer2">
<form> </form>
</div>
</div>
vet inte om jag förstår ditt problem .. men du kan ju ändra padding i lagret för att få lite mer utrymme i den .. känns ganska onödigt att ha 2 "lager" för det