Quote:
Originally Posted by nabsltd
You can't truly center anything without using more than just margins, and you don't need to touch margins to center something... text-align: center; centers the content.
OTOH, you can use the following to "center" an image without centering text:
Code:
.image-box {
text-align: left;
margin-left: 20%;
margin-right: 20%;
}
.image-fill {
width: 100%;
}
<p class="image-box"><img src="some-image.png" class="image-fill"><br />
An un-centered caption.
</p>
|
There is one thing you can center with margins. This leaves a 20% 2px line centered.
Code:
hr {
margin-top: 0.9em;
margin-right: 40%;
margin-bottom: 0.9em;
margin-left: 40%;
border-top: 2px solid;
}