Answers for "how to center a page in css"

CSS
0

html center body

body {
  display:flex; flex-direction:column; justify-content:center;
  min-height:100vh;
}
Posted by: Guest on July-28-2020
2

css image center

.container {
    position: relative;
    float: right;
    width: 100%;
    height: 250px;
    overflow: hidden;
}

.container img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    min-width: 100%;
    height: 100%;
    /* height: auto; */
    /* min-height: 100%; */
    margin-right: -50%;
    transform: translate(-50%, -50%);
    object-fit: contain;
    -o-object-fit: contain;
}
Posted by: Guest on July-27-2020
4

center a div

<div id="outer">
  <div id="inner">Foo foo</div>
</div>
//css:, demo with border
<style>
#inner {
  display: table;
  margin: 0 auto;
  border: 1px solid black;
}

#outer {
  border: 1px solid red;
  width:100%
}
</style>
Posted by: Guest on August-20-2020

Code answers related to "how to center a page in css"

Browse Popular Code Answers by Language