Question about my site layout, DIV inside another DIV is centering










0















So I am working on a site layout.
This is my html code:






body 
width: 100%;
font-size: 30px;
min-height: 100%;


#A
padding-left: 30px;
height: 200px;
width: 100%;
border: 1px solid black;


#B
height: 200px;
border: 1px solid black;
text-align: center;
vertical-align: middle;


#C
margin-top: 0px;
margin-left: 0px;
padding-left: 0px;
padding-top: 30px;
width: 20%;
height: 200px;
border: 1px solid black;
position: absolute;
text-align: left;


#D
margin-top: 0px;
width: 100%;
height: 75px;
border: 1px solid black;

<div id="A">
Header
</div>
<div id="B">
Main
<div id="C">
Nav
</div>
</div>
<div id="D">
De footer
</div>





So now if I open the site up, div C is inside div B like it's supposed to.
But like the text "Main" div C is not at the top of div B.
Its supposed to be just as big fitting perfectly inside of div B.
I'm wondering if anyone has a quick fix for this? Or is my padding wrong...
Thanks!










share|improve this question




























    0















    So I am working on a site layout.
    This is my html code:






    body 
    width: 100%;
    font-size: 30px;
    min-height: 100%;


    #A
    padding-left: 30px;
    height: 200px;
    width: 100%;
    border: 1px solid black;


    #B
    height: 200px;
    border: 1px solid black;
    text-align: center;
    vertical-align: middle;


    #C
    margin-top: 0px;
    margin-left: 0px;
    padding-left: 0px;
    padding-top: 30px;
    width: 20%;
    height: 200px;
    border: 1px solid black;
    position: absolute;
    text-align: left;


    #D
    margin-top: 0px;
    width: 100%;
    height: 75px;
    border: 1px solid black;

    <div id="A">
    Header
    </div>
    <div id="B">
    Main
    <div id="C">
    Nav
    </div>
    </div>
    <div id="D">
    De footer
    </div>





    So now if I open the site up, div C is inside div B like it's supposed to.
    But like the text "Main" div C is not at the top of div B.
    Its supposed to be just as big fitting perfectly inside of div B.
    I'm wondering if anyone has a quick fix for this? Or is my padding wrong...
    Thanks!










    share|improve this question


























      0












      0








      0








      So I am working on a site layout.
      This is my html code:






      body 
      width: 100%;
      font-size: 30px;
      min-height: 100%;


      #A
      padding-left: 30px;
      height: 200px;
      width: 100%;
      border: 1px solid black;


      #B
      height: 200px;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;


      #C
      margin-top: 0px;
      margin-left: 0px;
      padding-left: 0px;
      padding-top: 30px;
      width: 20%;
      height: 200px;
      border: 1px solid black;
      position: absolute;
      text-align: left;


      #D
      margin-top: 0px;
      width: 100%;
      height: 75px;
      border: 1px solid black;

      <div id="A">
      Header
      </div>
      <div id="B">
      Main
      <div id="C">
      Nav
      </div>
      </div>
      <div id="D">
      De footer
      </div>





      So now if I open the site up, div C is inside div B like it's supposed to.
      But like the text "Main" div C is not at the top of div B.
      Its supposed to be just as big fitting perfectly inside of div B.
      I'm wondering if anyone has a quick fix for this? Or is my padding wrong...
      Thanks!










      share|improve this question
















      So I am working on a site layout.
      This is my html code:






      body 
      width: 100%;
      font-size: 30px;
      min-height: 100%;


      #A
      padding-left: 30px;
      height: 200px;
      width: 100%;
      border: 1px solid black;


      #B
      height: 200px;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;


      #C
      margin-top: 0px;
      margin-left: 0px;
      padding-left: 0px;
      padding-top: 30px;
      width: 20%;
      height: 200px;
      border: 1px solid black;
      position: absolute;
      text-align: left;


      #D
      margin-top: 0px;
      width: 100%;
      height: 75px;
      border: 1px solid black;

      <div id="A">
      Header
      </div>
      <div id="B">
      Main
      <div id="C">
      Nav
      </div>
      </div>
      <div id="D">
      De footer
      </div>





      So now if I open the site up, div C is inside div B like it's supposed to.
      But like the text "Main" div C is not at the top of div B.
      Its supposed to be just as big fitting perfectly inside of div B.
      I'm wondering if anyone has a quick fix for this? Or is my padding wrong...
      Thanks!






      body 
      width: 100%;
      font-size: 30px;
      min-height: 100%;


      #A
      padding-left: 30px;
      height: 200px;
      width: 100%;
      border: 1px solid black;


      #B
      height: 200px;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;


      #C
      margin-top: 0px;
      margin-left: 0px;
      padding-left: 0px;
      padding-top: 30px;
      width: 20%;
      height: 200px;
      border: 1px solid black;
      position: absolute;
      text-align: left;


      #D
      margin-top: 0px;
      width: 100%;
      height: 75px;
      border: 1px solid black;

      <div id="A">
      Header
      </div>
      <div id="B">
      Main
      <div id="C">
      Nav
      </div>
      </div>
      <div id="D">
      De footer
      </div>





      body 
      width: 100%;
      font-size: 30px;
      min-height: 100%;


      #A
      padding-left: 30px;
      height: 200px;
      width: 100%;
      border: 1px solid black;


      #B
      height: 200px;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;


      #C
      margin-top: 0px;
      margin-left: 0px;
      padding-left: 0px;
      padding-top: 30px;
      width: 20%;
      height: 200px;
      border: 1px solid black;
      position: absolute;
      text-align: left;


      #D
      margin-top: 0px;
      width: 100%;
      height: 75px;
      border: 1px solid black;

      <div id="A">
      Header
      </div>
      <div id="B">
      Main
      <div id="C">
      Nav
      </div>
      </div>
      <div id="D">
      De footer
      </div>






      html css






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 13 '18 at 8:43









      Progressive

      8641023




      8641023










      asked Nov 13 '18 at 8:14









      Wouter SWouter S

      295




      295






















          3 Answers
          3






          active

          oldest

          votes


















          1

















          body
          width: 100%;
          font-size: 30px;
          min-height: 100%;

          #A
          padding-left: 30px;
          height: 200px;
          width: 100%;
          border: 1px solid black;

          #B
          height: 200px;
          border: 1px solid black;
          text-align: center;
          vertical-align: middle;
          position: relative;

          #C
          margin-top: 0px;
          margin-left: 0px;
          padding-left: 0px;
          padding-top: 30px;
          width: 20%;
          height: 200px;
          border: 1px solid black;
          position: absolute;
          text-align: left;
          top: 0;
          left: 0;

          #D
          margin-top: 0px;
          width: 100%;
          height: 75px;
          border: 1px solid black;

          <div id="A">
          Header
          </div>
          <div id="B">
          Main
          <div id="C">
          Nav
          </div>
          </div>
          <div id="D">
          De footer
          </div>





          I hope that works for you. You need to change the #B position: relative and then you can position the inner #C absolute. top: 0 and left: 0.
          If I understood your problem correctly, this looks should help you.






          share|improve this answer























          • Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

            – Wouter S
            Nov 13 '18 at 8:27


















          1














          If I get you right, you just want to fit the Nav div on top of the Main div?



          For that you have to make the Main div relative and add



          top: 0;


          to the Nav div.






          body 
          width: 100%;
          font-size: 30px;
          min-height: 100%;


          #A
          padding-left: 30px;
          height: 200px;
          width: 100%;
          border: 1px solid black;


          #B
          height: 200px;
          border: 1px solid black;
          text-align: center;
          vertical-align: middle;
          position: relative;


          #C
          margin-top: 0px;
          margin-left: 0px;
          padding-left: 0px;
          padding-top: 30px;
          width: 20%;
          height: 200px;
          border: 1px solid black;
          position: absolute;
          text-align: left;
          top: 0px;


          #D
          margin-top: 0px;
          width: 100%;
          height: 75px;
          border: 1px solid black;

          <div id="A">
          Header
          </div>
          <div id="B">
          Main
          <div id="C">
          Nav
          </div>
          </div>
          <div id="D">
          De footer
          </div>








          share|improve this answer






























            0














            To create a stable layout, it is not good idea to make #C as position: absolute; because it has some side-effects.

            and its good to change it's display to inline-block, then it works.






            share|improve this answer






















              Your Answer






              StackExchange.ifUsing("editor", function ()
              StackExchange.using("externalEditor", function ()
              StackExchange.using("snippets", function ()
              StackExchange.snippets.init();
              );
              );
              , "code-snippets");

              StackExchange.ready(function()
              var channelOptions =
              tags: "".split(" "),
              id: "1"
              ;
              initTagRenderer("".split(" "), "".split(" "), channelOptions);

              StackExchange.using("externalEditor", function()
              // Have to fire editor after snippets, if snippets enabled
              if (StackExchange.settings.snippets.snippetsEnabled)
              StackExchange.using("snippets", function()
              createEditor();
              );

              else
              createEditor();

              );

              function createEditor()
              StackExchange.prepareEditor(
              heartbeatType: 'answer',
              autoActivateHeartbeat: false,
              convertImagesToLinks: true,
              noModals: true,
              showLowRepImageUploadWarning: true,
              reputationToPostImages: 10,
              bindNavPrevention: true,
              postfix: "",
              imageUploader:
              brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
              contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
              allowUrls: true
              ,
              onDemand: true,
              discardSelector: ".discard-answer"
              ,immediatelyShowMarkdownHelp:true
              );



              );













              draft saved

              draft discarded


















              StackExchange.ready(
              function ()
              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53276551%2fquestion-about-my-site-layout-div-inside-another-div-is-centering%23new-answer', 'question_page');

              );

              Post as a guest















              Required, but never shown

























              3 Answers
              3






              active

              oldest

              votes








              3 Answers
              3






              active

              oldest

              votes









              active

              oldest

              votes






              active

              oldest

              votes









              1

















              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>





              I hope that works for you. You need to change the #B position: relative and then you can position the inner #C absolute. top: 0 and left: 0.
              If I understood your problem correctly, this looks should help you.






              share|improve this answer























              • Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

                – Wouter S
                Nov 13 '18 at 8:27















              1

















              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>





              I hope that works for you. You need to change the #B position: relative and then you can position the inner #C absolute. top: 0 and left: 0.
              If I understood your problem correctly, this looks should help you.






              share|improve this answer























              • Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

                – Wouter S
                Nov 13 '18 at 8:27













              1












              1








              1










              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>





              I hope that works for you. You need to change the #B position: relative and then you can position the inner #C absolute. top: 0 and left: 0.
              If I understood your problem correctly, this looks should help you.






              share|improve this answer
















              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>





              I hope that works for you. You need to change the #B position: relative and then you can position the inner #C absolute. top: 0 and left: 0.
              If I understood your problem correctly, this looks should help you.






              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>





              body
              width: 100%;
              font-size: 30px;
              min-height: 100%;

              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;

              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;

              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0;
              left: 0;

              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>






              share|improve this answer












              share|improve this answer



              share|improve this answer










              answered Nov 13 '18 at 8:25









              MichaelMichael

              269111




              269111












              • Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

                – Wouter S
                Nov 13 '18 at 8:27

















              • Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

                – Wouter S
                Nov 13 '18 at 8:27
















              Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

              – Wouter S
              Nov 13 '18 at 8:27





              Thanks! At least now it fits, the sizes aren't perfect but i'll fix that. Thank you!

              – Wouter S
              Nov 13 '18 at 8:27













              1














              If I get you right, you just want to fit the Nav div on top of the Main div?



              For that you have to make the Main div relative and add



              top: 0;


              to the Nav div.






              body 
              width: 100%;
              font-size: 30px;
              min-height: 100%;


              #A
              padding-left: 30px;
              height: 200px;
              width: 100%;
              border: 1px solid black;


              #B
              height: 200px;
              border: 1px solid black;
              text-align: center;
              vertical-align: middle;
              position: relative;


              #C
              margin-top: 0px;
              margin-left: 0px;
              padding-left: 0px;
              padding-top: 30px;
              width: 20%;
              height: 200px;
              border: 1px solid black;
              position: absolute;
              text-align: left;
              top: 0px;


              #D
              margin-top: 0px;
              width: 100%;
              height: 75px;
              border: 1px solid black;

              <div id="A">
              Header
              </div>
              <div id="B">
              Main
              <div id="C">
              Nav
              </div>
              </div>
              <div id="D">
              De footer
              </div>








              share|improve this answer



























                1














                If I get you right, you just want to fit the Nav div on top of the Main div?



                For that you have to make the Main div relative and add



                top: 0;


                to the Nav div.






                body 
                width: 100%;
                font-size: 30px;
                min-height: 100%;


                #A
                padding-left: 30px;
                height: 200px;
                width: 100%;
                border: 1px solid black;


                #B
                height: 200px;
                border: 1px solid black;
                text-align: center;
                vertical-align: middle;
                position: relative;


                #C
                margin-top: 0px;
                margin-left: 0px;
                padding-left: 0px;
                padding-top: 30px;
                width: 20%;
                height: 200px;
                border: 1px solid black;
                position: absolute;
                text-align: left;
                top: 0px;


                #D
                margin-top: 0px;
                width: 100%;
                height: 75px;
                border: 1px solid black;

                <div id="A">
                Header
                </div>
                <div id="B">
                Main
                <div id="C">
                Nav
                </div>
                </div>
                <div id="D">
                De footer
                </div>








                share|improve this answer

























                  1












                  1








                  1







                  If I get you right, you just want to fit the Nav div on top of the Main div?



                  For that you have to make the Main div relative and add



                  top: 0;


                  to the Nav div.






                  body 
                  width: 100%;
                  font-size: 30px;
                  min-height: 100%;


                  #A
                  padding-left: 30px;
                  height: 200px;
                  width: 100%;
                  border: 1px solid black;


                  #B
                  height: 200px;
                  border: 1px solid black;
                  text-align: center;
                  vertical-align: middle;
                  position: relative;


                  #C
                  margin-top: 0px;
                  margin-left: 0px;
                  padding-left: 0px;
                  padding-top: 30px;
                  width: 20%;
                  height: 200px;
                  border: 1px solid black;
                  position: absolute;
                  text-align: left;
                  top: 0px;


                  #D
                  margin-top: 0px;
                  width: 100%;
                  height: 75px;
                  border: 1px solid black;

                  <div id="A">
                  Header
                  </div>
                  <div id="B">
                  Main
                  <div id="C">
                  Nav
                  </div>
                  </div>
                  <div id="D">
                  De footer
                  </div>








                  share|improve this answer













                  If I get you right, you just want to fit the Nav div on top of the Main div?



                  For that you have to make the Main div relative and add



                  top: 0;


                  to the Nav div.






                  body 
                  width: 100%;
                  font-size: 30px;
                  min-height: 100%;


                  #A
                  padding-left: 30px;
                  height: 200px;
                  width: 100%;
                  border: 1px solid black;


                  #B
                  height: 200px;
                  border: 1px solid black;
                  text-align: center;
                  vertical-align: middle;
                  position: relative;


                  #C
                  margin-top: 0px;
                  margin-left: 0px;
                  padding-left: 0px;
                  padding-top: 30px;
                  width: 20%;
                  height: 200px;
                  border: 1px solid black;
                  position: absolute;
                  text-align: left;
                  top: 0px;


                  #D
                  margin-top: 0px;
                  width: 100%;
                  height: 75px;
                  border: 1px solid black;

                  <div id="A">
                  Header
                  </div>
                  <div id="B">
                  Main
                  <div id="C">
                  Nav
                  </div>
                  </div>
                  <div id="D">
                  De footer
                  </div>








                  body 
                  width: 100%;
                  font-size: 30px;
                  min-height: 100%;


                  #A
                  padding-left: 30px;
                  height: 200px;
                  width: 100%;
                  border: 1px solid black;


                  #B
                  height: 200px;
                  border: 1px solid black;
                  text-align: center;
                  vertical-align: middle;
                  position: relative;


                  #C
                  margin-top: 0px;
                  margin-left: 0px;
                  padding-left: 0px;
                  padding-top: 30px;
                  width: 20%;
                  height: 200px;
                  border: 1px solid black;
                  position: absolute;
                  text-align: left;
                  top: 0px;


                  #D
                  margin-top: 0px;
                  width: 100%;
                  height: 75px;
                  border: 1px solid black;

                  <div id="A">
                  Header
                  </div>
                  <div id="B">
                  Main
                  <div id="C">
                  Nav
                  </div>
                  </div>
                  <div id="D">
                  De footer
                  </div>





                  body 
                  width: 100%;
                  font-size: 30px;
                  min-height: 100%;


                  #A
                  padding-left: 30px;
                  height: 200px;
                  width: 100%;
                  border: 1px solid black;


                  #B
                  height: 200px;
                  border: 1px solid black;
                  text-align: center;
                  vertical-align: middle;
                  position: relative;


                  #C
                  margin-top: 0px;
                  margin-left: 0px;
                  padding-left: 0px;
                  padding-top: 30px;
                  width: 20%;
                  height: 200px;
                  border: 1px solid black;
                  position: absolute;
                  text-align: left;
                  top: 0px;


                  #D
                  margin-top: 0px;
                  width: 100%;
                  height: 75px;
                  border: 1px solid black;

                  <div id="A">
                  Header
                  </div>
                  <div id="B">
                  Main
                  <div id="C">
                  Nav
                  </div>
                  </div>
                  <div id="D">
                  De footer
                  </div>






                  share|improve this answer












                  share|improve this answer



                  share|improve this answer










                  answered Nov 13 '18 at 8:29









                  f.overflowf.overflow

                  24819




                  24819





















                      0














                      To create a stable layout, it is not good idea to make #C as position: absolute; because it has some side-effects.

                      and its good to change it's display to inline-block, then it works.






                      share|improve this answer



























                        0














                        To create a stable layout, it is not good idea to make #C as position: absolute; because it has some side-effects.

                        and its good to change it's display to inline-block, then it works.






                        share|improve this answer

























                          0












                          0








                          0







                          To create a stable layout, it is not good idea to make #C as position: absolute; because it has some side-effects.

                          and its good to change it's display to inline-block, then it works.






                          share|improve this answer













                          To create a stable layout, it is not good idea to make #C as position: absolute; because it has some side-effects.

                          and its good to change it's display to inline-block, then it works.







                          share|improve this answer












                          share|improve this answer



                          share|improve this answer










                          answered Nov 13 '18 at 8:27









                          RGhanbariRGhanbari

                          944




                          944



























                              draft saved

                              draft discarded
















































                              Thanks for contributing an answer to Stack Overflow!


                              • Please be sure to answer the question. Provide details and share your research!

                              But avoid


                              • Asking for help, clarification, or responding to other answers.

                              • Making statements based on opinion; back them up with references or personal experience.

                              To learn more, see our tips on writing great answers.




                              draft saved


                              draft discarded














                              StackExchange.ready(
                              function ()
                              StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53276551%2fquestion-about-my-site-layout-div-inside-another-div-is-centering%23new-answer', 'question_page');

                              );

                              Post as a guest















                              Required, but never shown





















































                              Required, but never shown














                              Required, but never shown












                              Required, but never shown







                              Required, but never shown

































                              Required, but never shown














                              Required, but never shown












                              Required, but never shown







                              Required, but never shown







                              Popular posts from this blog

                              How to how show current date and time by default on contact form 7 in WordPress without taking input from user in datetimepicker

                              Syphilis

                              Darth Vader #20