php - 包含绝对/相对定位的 2 列布局的 CSS

标签 php html css stylesheet

我对 CSS 毫无用处,我正在尝试创建一个两列等宽的效果。唯一的问题是我有一些现有的 html 必须位于左侧框中,并且需要将元素添加到右侧框中。

这是左侧的源代码(我已经包含了 CSS 内联):

<div id="photoContainer" style="position:relative; width:400px; height: 400px;background:#845454;margin-left:20px;overflow: hidden;" >
   <img id="imgPhoto" style="z-index:1000; position:absolute; left:60px; top:23px; width:280px; height:354px" alt="photo" src="images/model.png" class="resize" />
   <img id="imgFrame" style="z-index:1005; position:absolute; left:0px; top:0px; width:400px; height:400px" alt="frame" src="images/wigs/Wig1.png" />
</div>

尽我所能,我无法让 CSS 正确地在左侧显示上面的内容并在右侧显示更多控件。

希望你能帮助我。

谢谢

最佳答案

不太清楚你必须做什么,但总的来说:

<div id="container">
<div id="column1">...</div>
<div id="column2">...</div>
</div>

CSS:

#container {
  float: left;
  width: 100%;
}
#column1, #column2 {
  width: 50%;
  float: left; 
}

关于php - 包含绝对/相对定位的 2 列布局的 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12999064/

相关文章:

php - Javascript 添加 PHP 文件

jquery - BootStrap 多个事件导航选项卡问题

html - :first-child selector doesn't work

html - CSS:如何让一个按钮始终位于 Angular 落中另一个按钮的左侧?

php - $wp_query->max_num_pages 不适用于 CPT

PHP curl 问题 - 尝试发送 XML post 请求

java - 下拉菜单显示在 md 和 lg 中,不知道如何修复它(Bootstrap 3.6.6)

javascript - ExtJs 4 - 淡入应用程序视口(viewport)

javascript - 当键盘出现时隐藏页脚 Mobile Web Muse UI

javascript - php javascript中的多折线图