Centered text

by andreasisaak

HTML

<div class="center">
    <p><span>Cras mattis consectetur purus sit amet fermentum. Cras mattis consectetur purus sit amet fermentum. Aenean fdsf gds ds sgsffffffs fdfd</span></p>
</div>

<div class="bottom">
    <p><span>Cras mattis consectetur purus sit amet fermentum. Cras mattis consectetur purus sit amet fermentum. Aenean fdsf gds ds sgsffffffs fdfd</span></p>
</div>

CSS

p {
	background-color: #cee0ea;
    height:300px;
    text-align: center;
    margin:20px;
    width:300px;
    float:left;
}

.center p span {
	width: 75%;
	display: inline-block;
	margin-right: auto;
	margin-left: auto;
	vertical-align: middle;
}

.center p:after {
	content: " ";
 	display: inline-block;
 	height: 50%;
}

.bottom p span {
	width: 75%;
	display: inline-block;
    margin-bottom:25px;
	margin-right: auto;
	margin-left: auto;
	vertical-align: bottom;
}

.bottom p:after {
	content: " ";
 	display: inline-block;
 	height: 100%;
}