Monday, May 6, 2019

47 div classes with margins

File =: 47.html

Learned points... w3schools listed Margin-top margin-bottome margin-right and margin-left. However, when short cutting it goes Margin: Top Right Bottom Left.
I took a while getting my .c div right :)

Code:
<!DOCTYPE html>
<html>
<head>
<title> 47 Wolverine facts</title>
<style>
.a {border: 1px solid black; margin-top: 100px; margin-bottom: 100px; margin-right: 150px; margin-left: 80px; background-color: lightblue;}
.b { background-color: red; border: 5px solid blue; margin: 100px 100px 150px 70px;}
.c { border: 3px dotted blue; margin: 25px 550px 80px 100px;}
.d { color: white; background-color: black; border: 10px solid red; margin-top: 100px; margin-bottom: 100px; margin-right: 150px; margin-left:30px;}
</style>
</head>
<body>

<div class="a">
<p>The wolverine lives in the remote Arctic and sub-Artic regions of the world.</p>
</div>
<div class="b">
<p>The wolverine is a powerful animal that resembles a small bear but is actually the largest member of the Mustelidae (weasel) family.</p>
</div>
<div class="c">
<p>Wolverines have an average lifespan between 7 and 12 years in the wild.</p>
</div>
<div class="d">
<p>Wolverines live primarily in isolated regions of northern Canada, Alaska, Siberia, and Scandinavia.</p>
</div>
</body>
</html>

No comments:

Post a Comment