CODEWITHSUNDEEP
cssmargincentercentering
clickbait
clickbait

Reputation: 2998

All margins are equal, but some margins are more equal than others

div {
    width: 100px;
    margin: 0 auto;
}

This CSS horizontally centers a block element.

Is it possible to offset auto margins' proportions? For instance, make the left margin twice as big as the right margin?

Upvotes: 1

Views: 69

Answers (1)

Scott Weaver
Scott Weaver

Reputation: 7351

You could use some empty divs and "flex" the left side at twice the rate:

body {
  display: flex;
}

#left {
  flex: 2
}

#content {
  width:100px;
  background-color: pink;
}

#right {
  flex: 1
}
<div id="left"></div>
<div id="content">content</div>
<div id="right"></div>

Upvotes: 1

Related Questions