Tekst uitlijnen

Status
Niet open voor verdere reacties.
T

Tdgjules

Gebruiker
Lid geworden
6 apr 2011
Berichten
19
Ik ben bezig met een nieuw design en wil hierbij een menu maken aan de linker kant van de pagina. Nu wil ik dat elke menu optie wordt weergegeven in het wit en in een blok van 150x150 px. Opzich lukt dit wel maar ik wil dat de tekst in het midden staat, en dus niet bovenaan in het blok.

Hoe kan ik dit het beste doen?
Dit is tot nu mijn CSS-code:
Code: 
/* ========== Navigation style ========== */

nav {
	font: "Courier New", Courier, monospace;
	font-size: 18px;
	font-weight: bold;
	text-decoration:blink;
	color:#FFF;
	text-align:center;
	
}

.nav-square {
	background-color:#F90;
	width: 150px;
	height: 150px;
	display:block;
}
 
Dan doe je

Code: 
line-height: 150px;

Heb je een voorbeeld waar de code staat?

Gr.
Lauren
 
Bedankt werk perfect!

index.html:
Code: 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Blocks template by J-Projects</title>
<link href="css/main.css" rel="stylesheet" type="text/css">
<meta charset="utf-8">
<meta name="description" content="This template is designed by J-Projects" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js">
<!-- This template is tested on WebKit. Because Firefox, IE and opera have another engine than Safari and Chrome, we implement the Webkit engine here -->
</script>
</head>

<body onLoad="CFInstall.check()">
<br />
<br />

<nav>
	<div class="nav-square">
    	<ul>
        	<li>Menu 1</li>
        </ul>
    </div><div class="nav-square">
        <ul>
            <li>Menu 2</li>
        </ul>
    </div>
</nav>	
</body>
</html>

en main.css:
Code: 
@charset "utf-8";
/* This is the main CSS file */
/* To implement your own styles, head over to the own.css file! */

/* Blocks Template */
/* Designed by J-Projects */
/* Version: 1.0.0 */

/* ========== Main Style ========== */
body {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	background-image:url(../img/navy_blue_big.png);
	background-repeat: repeat-x repeat-y;
}

/* ========== Navigation style ========== */

nav {
	font: "Courier New", Courier, monospace;
	font-size: 18px;
	font-weight: bold;
	text-decoration:blink;
	color:#FFF;
	text-align:center;
	
}

.nav-square {
	background-color:#F90;
	width: 150px;
	height: 150px;
	display:block;
	text-align: center;
	line-height:150px;
	
}
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan