How to horizontally center a div inside a div using css

Yes its very easy to center a block element inside other block element using simple css. Here is an example.

If you have following HTML code:

<div class="outerDiv">
    <div class="innerDiv"></div>
</div>

This is how we make innerDiv center horizontally.

.outerDiv{
width:100%
}
.innerDiv {
    width: 980px;
    margin: 0 auto;
}
 
if you are using IE8+ you have to do things like.
 
.innerDiv {
   display: table;
}

Recently Published

»

Know-How DevOps Benefits Your Business

The organizations in this current fast-paced environment need to ...

»

10 Best Prototyping Tools for UI/UX Designers

Website design for a client gets only successful if you follow their ...

»

Social Media Marketing: Strategy To Boost Ecommerce-Traffic

According to a recent study, the experts revealed that people aged ...

»

How Flutter Can Help Reduce Overall Mobile App Development Cost?

Before jumping on answering the question, let me first walk you ...

»

Which One is Better? DigitalOcean Or AWS?

Digitalocean or AWS: Picking a cloud service for your application or ...

»

Killing way to select Domain Name and Hosting

Planning to launch your online presence? We know it’s all very ...

»

7+ blogs to inspire how they made more than $200 in a day

On this page I want to go through the blogs on how they earn money ...

»

5 Best Practices to Make Responsive Web Design in 2020

According to statistics, 40.1% of the time spent on websites came ...

»

7 sites to download free stock videos for TikTok or YouTube

Many of us always wandering for free stock videos to integrate into ...