Announcement

**Excavator** · Apr 1, 2009, 03:47 PM

Hello Dhuan,
The way it is now there is no tags for styling the text so your limited to styling .title

Since it's just a heading you could use h1, h2, h3 ... and style that. Works really well and that's what the heading tags were made for.

I've used your example, h1 tag on the second example and styled the text in the 3rd example here -

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
	font: 14px "Comic Sans MS";
	background: #FC6;
	text-align: center;
}
* {
	margin: 0;
	padding: 0;
	outline: none;
	border: none;
}
#container {
	width: 800px;
	margin: 30px auto;
	background: #999;
	overflow: auto;
}
.title {
	width:100%;
	height:50px;
	line-height: 50px; /*vertically centers text*/
	background-color:skyblue;
	font-size:20px;
	margin: 10px 0; /*just to separate them a little*/
}
.title p {
	text-align: left;
	color: #3F0;
	margin: 0 0 0 100px;
}
</style>
</head>
<body>
    <div id="container">    
        <div class="title">
        	here's my title
        </div>
        
        <h1 class="title">here's another title</h1>
        
        <div class="title">
        	<p>a third title</p>
        </div>
    <!--end container--></div>
</body>
</html>

http://www.w3schools.com/css/css_text.asp

...

Announcement

inside div text positioning issue

inside div text positioning issue

Comment