Just starting to learn how to work with sites, I ran into the problem of centering the site itself in the center, watching different videos, everything works on video, but I don’t.

body{ background: url(img/BG.jpg) no-repeat 100%; font-family: Arial, Tahoma, Sans-serif; padding: 40px 0; } .wrapper{ width: 960px; margin: 0 auto; }

The text is not aligned, but still oriented to the left upper edge - why?

Can someone suggest how to immediately set the width and centering of the site in the center in %

I look forward to help, and I would be happy to learn from someone!

  • you can code on jsFidd let's say - MoJlo4HuK
  • The margin is responsible for the external indents of the block, to work with the position of the text inside the block, you need to use text-align - Dmitry Kulevich
  • By CSS code everything is correct ... Most likely you did not specify the class wrapper html tag. - Qsandrew
  • You can learn for free here - Igor Lavrynenko

3 answers 3

Add a center pointer, try this:

 body{ text-align:center; background: url(img/BG.jpg) no-repeat 100% center; font-family: Arial, Tahoma, Sans-serif; padding: 40px 0; }

    Center block, for example:

     .wrapper{ width: 960px; margin-left: -480px; left: 50%; position: absolute; }

      A more detailed version of the text-align from Dmitry Kulevich

      Your .wrapper , 99.9% sure is a div элементом . Div is a block element, a block element has the ability to stretch to the full width of the parent, in your case, it is most likely the body, since html and body by default stretch to the full width of the monitor screen, your wrapper is also stretched to the full width . This can be easily checked, set your border border: 1px solid #000 and you will see how it is stretched ... Go ahead, the text in block elements is centered on the left by default, which you observe. If you want the text to be in the middle of a block element, you need to "say" this to it text-align: center