Centrera div-meny

2 svar · 364 visningar · startad av mottosson 23 jan. 2009

mottossonMedlem sedan mars 200339 inlägg

Frågan23 jan. 2009 22:36#1

Jag vill centrera följande meny men får inget att fungera.... någon som vet hur man gör?

tack!

<html>
	<head>
		<link href="css.css" rel="stylesheet" type="text/css">
	</head>
	<body>
      <div class="menu">
         <div class="menuitem">
            <a href="">Meny1</a>
         </div>
         <div class="menuitem">
            <a href="">Meny2</a>
         </div>
         <div class="menuitem">
            <a href="">Meny3</a>
         </div>
         <div class="menuitem">
            <a href="">Meny4</a>
         </div>
         <div class="menuitem">
            <a href="">Meny5</a>
         </div>
         <div class="menuitem">
            <a href="">Meny6</a>
         </div>
      </div>
	<body>
<html>

.menu {
	background-color:#FFFFFF;
	display:block;
	height:36px;
	padding: 0;
	margin:0;
}
 
.menuitem {
	display:block;
	float:left;
	height:40px;
	min-width:30px;
	padding:5px 12px 0;
	text-align:center;
}

HexenhammerMedlem sedan jan. 20097 inlägg

1 feb. 2009 09:38#2

Tror du måste sätta en center-kod på #menu också. Om det är IE det gäller i
alla fall. Du får gärna skriva mer om specifika webbläsare och sådär. Jag brukar
alltid åka på att skriva en kod speciellt för IE och en för andra webbläsare.

PrometheusMedlem sedan mars 2001363 inlägg

1 feb. 2009 10:05#3

menar du att du vill ha den i mitten på sidan?

Ett sätt:

.menu {
	background-color:#FFFFFF;
	display:block;
	height:36px;
	padding: 0;
	margin: 0 auto;
	width: 200px;
	text-align:center;
}

Ett annat sätt:

.menu {
	background-color:#FFFFFF;
	display:block;
	height:36px;
	padding: 0;
	position: absolute:
	left: 50%;
	width: 200px;
	margin-left: -100px;
}