0

我正在研究一个 CMS 模板,并试图找出这是否可能。我在网上找不到任何东西,也许我只是使用了错误的关键字。


给出这个模型:

http://img833.imageshack.us/img833/4979/alignmentmockup.jpg

<div> #1是一个固定的“横幅”容器,左对齐。

<div> #2是另一个具有固定宽度的容器。它应该使用整个站点作为测量(比例#2)居中,但不应与<div> #1(比例#1)重叠。


问题:当浏览器窗口太小(例如调整大小,移动浏览器)时,容器与<div> #1. 根据它们的 z-index,其中一个在另一个之上。

方法 1:两个容器都在同一个 z-index 上。<div> #2margin:0 auto;
,但这并不能阻止它们重叠。

方法 2:两者都有样式position: relative; float: left; z-index: 10
,但 <div> #2不再与网站中心对齐。


由于这是我正在处理的受限模板后端,因此我无法根据需要添加其他容器。我只能访问<body>网站功能的开头和开头之间的 HTML 文件部分。所以我只能添加单独<div>的 s (like <div> #1) 但不能将它们与网站的其余部分 (like <div> #2) 级联。

任何提示另一种方法表示赞赏!

4

1 回答 1

0

您的问题是 CSS 没有最小边距,您可以在 div2 上设置宽度为 div1 的最小边距。我记得不久前读过一篇关于这个的文章,并找到了 Ron Adair 的一个很好的解决方案:

http://www.iamron.com/downloads/min-padding.html

提供更复杂解决方案的完整文章。Ron 然后评论了他获得相同结果的更简单方法:

http://buildinternet.com/2009/10/purely-css-faking-minimum-margins

于 2010-11-15T12:53:36.840 回答