There is a block that lies in the content block, this content limited in width, but it’s necessary that my block occupy the entire width in the visible area (i.e., as if the parent was a body), while that the cross-browser is more or less preserved. The menu had the same problem - made a crutch - behind the bar in the color of the menu with absolute positioning. How to do with the slider I do not know, maybe there is a simpler way about which you need to know? The structure is as follows:

 -body style="width:100%"(занял всю видимую ширину) --div id="content" style="width:70%" ---div id="slider" style="width:100%" текст ---/div --/div -/body

Once again, the essence of the question is more briefly: stretch the #slider across the width of the body , without breaking the layout.

  • You should add your code to the question. - AivanF.
  • all html markup? that's why I gave the link, with a browser debugger it's easier to understand what's what. - Maximmka
  • Here, people prefer to answer quality questions with a detailed description of the problem without unnecessary details. And do not climb on the links, to understand what is happening. - AivanF.
  • HTML and CSS is not my theme, I just, in a friendly way, advise :) - AivanF.
  • thanks, I will consider - Maximmka

2 answers 2

if I understand you correctly, then you need to place the slider to the full width of the document, but you chose to place all your content in a container (.content) that limits the width. So, in this case, it is better to wrap each block of yours in this container, which should be limited in width, but do not wrap the block with the slider and give it a width of 100%.

something like this:

HTML

 <div class="wrapper"> <header>...</header> <nav>...</nav> </div> <div class="wrapper"> <main>...</main> </div> <div class="slider">...</div> <div class="wrapper"> <footer>...</footer> </div>

CSS

 wrapper { width: 1024px;}

    Styling by id bad practice, create a separate class like .container and limit the content to be centered.