CSS使div与正文相关的宽度为100%,而不是父div [英] CSS make div 100% width relevant to body and not it's parent div

查看:72
本文介绍了CSS使div与正文相关的宽度为100%,而不是父div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有

<div style="position:relative; width:500px;">
    <div style="position:absolute; width:100%"></div>
</div>

子div占其父div宽度的100%.有没有办法我可以强迫它采取100%的宽度而不是父div的宽度.相对和绝对定位都是必需的,因为我在上面的代码中具有它.

The child div takes 100% width of it's parent div. Is there a way i can force it to take 100% width of body and not the parent div. Both relative and absolute positioning are required as i have it in the code above.

推荐答案

做到这一点同时又保持代码中相对和绝对位置不变的唯一方法是使用JavaScript.您需要获取窗口宽度并将其设置为div宽度.您还需要在调整大小时检测窗口大小,以便始终将div调整设置为当前窗口宽度.

The only way to do this while keeping the relative and absolute positioning as you have in your code is to use JavaScript. You need to get window width and set that as the div width. You also need to detect window size on resize so you always have your div adjust set to the current window width.

您可以通过其他2种方法执行此操作,但值得一提

The other 2 ways you can do this may not be options for but worth mentioning

  1. 将子div放到父div之外.
  2. 或将其设置为固定位置.这样做可能不会产生理想的效果.不论页面滚动如何,div都将始终位于同一位置.

这篇关于CSS使div与正文相关的宽度为100%,而不是父div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆