Question

How to horizontally center an element inside another element in CSS

Answer 1

<!-- HTML -->

<!DOCTYPE html>
<html>
<body>
<div id="outer">
    <div id="inner">Horizontally center this element inside another element</div>
</div>
</body>
</html>
 

/* CSS */

#inner {
  display: table;
  margin: 0 auto;
  border: 1px solid red;
}

#outer {
  border: 1px solid green;
  width: 100%;
}

 

70+ SQL courses for beginners and professionals