我正在研究我的投资组合,我遇到了项目描述的问题,当浏览器调整大小时,向左移动图像。此处问题的图片:单击此处当您调整浏览器大小时,文本将切换并向下移动图像。我已经尝试设置最小宽度,但这对文本和图像div没有帮助,以确保它不会在某一点调整大小。
以下是页面本身的示例链接:[点击此处] [2]
我尝试将min-width添加到图像元素,但这也不起作用。我不想使用绝对位置,因为它会在调整大小时重叠。有什么想法或建议吗?
答案 0 :(得分:1)
您的图像宽度为1052像素,位于UL元素中,左边距为1.5em。您的描述框是350px。基本上你的#imagewrapper
div需要等于或宽于所有这些元素。
现在大约是1422像素。如果UL.imagewrap-pad
的有效字体大小发生变化,它会发生变化。
这是一个非常广泛的网站。你可能应该把它缩小一点,如果你是为了一般观看,特别是现在所有的平板电脑等。
无论如何,你想要的代码是
#imagewrapper
{
width:1422px;
margin:0 auto;
}
第二行使其在屏幕上居中。
P.S - 获取Firefox的Firebug,或使用chrome中的类似工具。他们让你无休止地尝试使用样式来找出对你有用的东西。
答案 1 :(得分:0)
要解决此问题,只需在#imagewrapper中设置“width”属性:
#imagewrapper {
width: 1430px;
}
答案 2 :(得分:0)
您是否尝试将父元素的宽度attr设置为大约1800px?
div#imagewrapper { 宽度:1800px; }
它会在您的浏览器底部放置一个滚动条,但如果您想在该文本旁边放置如此大的图像,那么您确实需要大量空间。请记住,它不适合用户监视器。 为了让它看起来不错,我想你应该将该属性应用于body标签。