This is my HTML code snippet.
<div id="splash"> <div class="post"> <h2>Heading </h2> <p><embed src="images/dop.pdf" ALIGN=CENTER width="820" height="375"></p> </div></div>
Here's the relevant CSS from my style.css file:
#splash {padding: 40px;position: relative;background: #FFF;margin: 20px 0 0 0;height: 300px;width: 1100px;box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);}.post {
margin-left: auto ;margin-right: auto ;}
p {margin-bottom: 1.75em;margin-left: auto ;margin-right: auto ; }
#splash {padding: 40px;position: relative;background: #FFF;margin: 20px 0 0 0;height: 300px;width: 1100px;box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);}.post {margin-left: auto ;margin-right: auto ;}p {margin-bottom: 1.75em;margin-left: auto ;margin-right: auto ; }
Setting the margin-left and margin-right to auto, in either the post-class or the p> tag, should center what's in the div.