Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialFilippo D'Arrigo
5,285 PointsCenter with block property
Hi everyone! I aligned my main banner to the center of the page using inline-block and setting the width to 90% but I wonder if somehow it's possible to do the same using the block property.
<div class="main-banner">
<h1>This is the Main Banner Heading</h1>
<p>Andouille pork chop pancetta drumstick ground round beef ribs swine brisket ham.</p>
</div>
```css
.main-banner {
width:90%;
background: #dfe2e4;
text-align: center;
padding: 30px 15px;
display: inline-block;
margin-top:20px;
margin-bottom:20px;
}
1 Answer
Marc Busby
35,550 PointsHi Filippo,
I believe the only way to center a block element is to set the margin to auto. Happy to be corrected on this but I'm pretty sure that's the way to do it.
display: block;
margin: auto;
Regards,