Here is the HTML code snippet that I am working with:
<div class="top">
<div class="header title">Some Big Header Goes Here</div>
<div class="sub-header title">The fancyness enters here.</div>
<a href="#">A random link</a>
</div>
This code is styled using the following classes:
.header {
padding:2%;
}
.sub-header {
font-size:120%;
font-style:italic;
}
.title {
font-size:158%;
line-height:80%;
}
.top {
display:block;
text-align:center;
border:1px solid lime;
padding:1%;
}
.top a {
/*color:red;*/ /* This option changes the color which is not desired */
padding:100000px; /* Trying to add padding which is not successful */
margin:-999999px; /* Attempting to adjust margin which has no effect */
}
My question is, how can I style the anchor link to add a bit of padding and margin in order to create some space between the link and the two headers above it?