Build Your Own Business Website header image

Thesis 2.0 – How to Center an HTML Box

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session we discuss how to center an HTML box and show an example of this using the Container. You can center any HTML element by giving it a specific width and setting margins left and right to auto and it will center itself in the given space.

Video Transcript

Well, so Ashley said, “For some reason, my container is left aligned. How do I center it?” Depends on what you mean by left aligned that’s why I unmuted your microphone here because it could be… if you’re talking about a regular HTML container, say this container here, this container here is centered by giving it a specific width and setting its left and right margins to auto.

So if you come over and look at the CSS and look at the container… This is a standard HTML system. The width is set at 959 pixels and the margin, right is set to auto and left is set to auto. And that’s exactly the way you center any HTML element inside of anywhere. So you give it a specific width then you set its margins left and right to auto and it will center itself on that space. So if you container doesn’t have a specific width or if it doesn’t have a right margin and a left margin set to auto then it’s not going to be centered.

0 Comments… add one

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
THIS IS A LIMITED TIME OFFER!
Subscription Options
0 comments… add one

Leave a Comment