CODEWITHSUNDEEP
htmlcss
KyelJmD
KyelJmD

Reputation: 4732

CSS Centering a div in different Screens

I am wondering if the div in this css and html will stay at the center if I i view this site on a larger screen. since I am only working on a 16 inch screen/ monitor. will the div in this code will stay at the center even if I move or view it in a larger/different screen? ?

The Html

<html>
 <head>
  <title>Midterm Practice</title>
  <link rel = "stylesheet" type = "text/css" href = "layout.css"/>
 </head>
  <body>
    <div id = "container">
      <div id = "navbar">
        <ul>

        </ul>
      </div>
    </div>
  </body>
</html>

The CSS rules

body{background-color: pink;}
#container{background-color: white;margin-left: auto;margin-right: auto;border: 1px solid white;border-radius: 15px;width: 1000px;height: 800px;}
#navbar{position:absolute;}

I am just starting out with CSS please don't add advance or above average answers

Upvotes: 0

Views: 2210

Answers (1)

drmonkeyninja
drmonkeyninja

Reputation: 8540

Using margin-left: auto; margin-right: auto; should have the desired effect for you. They will basically centre the "container" div in the body tag. You could always test it out yourself by reducing the width of the container to something you can test in your browser (Chrome and Firefox's dev tools are useful for playing with CSS within the browser).

Upvotes: 1

Related Questions