CSS text-align Property - Playground Example

« Back to CSS text-align Property

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div {
   background: rgba(0, 255, 0, .1);
   margin-bottom: 10px;
}
.test {
   text-align: left; 
}
.test2 {
   text-align: center; 
}
.test3 {
   text-align: right;
}
.test4 {
   text-align: justify; 
}
</style>
</head>
<body>
<div class="test"> Eat these soft French rolls and drink some tea.</div> 
<div class="test2">Eat more of these soft French rolls and drink some tea. </div> 
<div class="test3">Eat these soft French rolls and drink some tea.</div> 
<div class="test4">Eat these soft French rolls and drink some tea.  Eat these soft French rolls and drink some tea.  Eat these soft French rolls and drink some tea.  Eat these soft French rolls and drink some tea. Eat these soft French rolls and drink some tea.</div> 

</body>
</html>

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

☕ Buy a Coffee