'Stretching' a div to the edge of a browser_问答_开发者

'Stretching' a div to the edge of a browser

开发者 https://www.devze.com 2023-02-21 12:21 出处：网络

I have an absolutely positioned header with background image. I would like both divs (also with background image) \"stretch\" from my header to the left and right edges of the users browser without ne

相关专题：css jquery

I have an absolutely positioned header with background image. I would like both divs (also with background image) "stretch" from my header to the left and right edges of the users browser without needing a开发者_Go百科 scrollbar. How could I do this? Thanks!

Use width: 100%; and set the position to left: 0px;.

Check out: http://jsfiddle.net/joshcomley/ma26B/

THis is normally done with width:100% on CSS. I mean, browser nuances notwithstanding.

See normally a HTML page have the margins set to 5px or something else. But if you want your div element to be stretched up to the both edges do this --

<html>
      <head>
            <style>
                   body { margin: 0px 0px 0px 0px; background: #555; }
                   div.element { width: 100%; display: block; background: #000; color: #fff; padding: 5px 5px;}  
            </style> 
      </head>
      <body>
             <div class="element">Stretched to the both edges of you HTML page!</div> 
      </body> 
</html>

That's all just copy and past the above code in your HTML page and execute and see the magic!

I hope this would help!