当前位置: 首页 > 面试题库 >

CSS位置绝对全角问题

艾嘉石
2023-03-14
问题内容

我有2个div和一个dl:

<div id="wrap">
 <div id="header">
  <dl id="site_nav_global_primary">

这是我的风格:

#wrap {
margin:0 auto;
width:100%;
min-width:760px;
max-width:1003px;
overflow:hidden;
}

#header {
width:100%;
position:relative;
float:left;
padding-top:18px;
margin-bottom:29px;
}

#site_nav_global_primary {    
float:right;
margin-right:18px;
margin-bottom:11px;
margin-left:18px;
}

现在,我想更改site_nav_global_primary以具有全屏宽度,而无需更改换行和标题。但是当我尝试:

#site_nav_global_primary {    
position: absolute;
width:100%;
top:0px;
left:0px;
}

导航获得包装器的100%,最大宽度为1003px。我希望它可以扩展到最大而不更改wrap和header div。

这可能吗?


问题答案:

您可以将leftright属性都设置为0。这将使得在div拉伸到文档的宽度,但要求没有父元件被定位(这不是的情况下,看到#headerposition: relative;

#site_nav_global_primary {    
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}


 类似资料:
  • 问题内容: 我有3个要素。 第一个更大(包装)并具有 第2个相对于第1个相对位置绝对定位(并包含在第1个中) 第3个包含在第2个中,并且也具有绝对定位。 为什么第3个位置相对于第2个绝对位置(这也是第1个位置的绝对位置)而不是相对位置的第一个位置? 因为3rd 是绝对定位到2nd的绝对定位。 问题答案: 因为就像重置孩子的相对位置一样。 这是无法解决的-如果您希望第三个相对于第一个绝对定位,则必须

  • 问题内容: 我一直在努力奋斗。我想绝对定位将在div中移动的图像,并希望剪切超出div的任何内容。这是问题的示例: 因此,我希望徽标的右边缘不显示。有想法吗? 问题答案: 由于图像的容器是绝对放置的,因此它不在“包含” div的范围之内。 您的选择是使用jQuery动态定位相对位置或调整绝对定位div的尺寸。

  • css问题 下面代码 为什么ul使用绝对定位居中 a元素变成块元素 文字会垂直 代码 为什么用绝对定位居中宽度展示文字会被挤下去 如下图 如果用flex布局居中就是没问题 代码如下图 效果如下图

  • 问题内容: 和CSS 和有什么不一样?那你什么时候应该使用呢? 问题答案: CSS绝对定位 绝对定位是最容易理解的。您从CSS 属性开始: 这告诉浏览器应将要定位的所有内容从文档的正常流程中删除,并将其放置在页面上的确切位置。它不会影响HTML中它之前或之后的元素在网页上的放置方式,但是除非您重写它,否则 它将 取决于其父级的位置。 如果你想一个元素从文档窗口的顶部10个像素的位置,你会使用偏移与

  • 问题内容: 我在另一个div内有两个div,我想使用css将一个子div放在父div的右上角,另一个子div放在父div的底下。即,我想对两个子div使用绝对定位,但是将它们相对于父div而不是页面定位。我怎样才能做到这一点? 范例html: 问题答案: 这工作,因为手段类似“使用,,,来定位自己相对于谁拥有最近的祖先或”。 因此,我们使have 和子代都有,然后使用和定位子代。

  • 我在iText7中添加一个相对于页面大小具有绝对位置的图像有一个问题。 在itext5中,我使用了下面的代码来确定图像相对于要将其添加到的页面的位置 现在,对于itext7,我正在使用