我正在尝试将右浮动div扩展到左侧。 我有一个图像,并希望在图像的右侧放置一些文字。 编辑 目标是该网站保持动态。所以我不能使用固定宽度。 一种方法是使用Javascript,我想但我更愿意在HTML CSS中尽可能这样做。
这是我的照片 这是我希望拥有的图片
如何将右侧div扩展到左侧? 或者我应该在中间使用div?
这是HTML
<div id="logo_container">
<div id="logo_image">
<img src="../img/KI_Logo_Long_FINAL.png" width="439" height="150" alt="KI-consult logo rectangle">
</div> <!-- div id="logo_image" -->
<div id="logo_address" height="150">
test<br>address 1 <br>address2
</div> <!-- div id="logo_address" -->
</div> <!-- div id="logo_container" -->
和CSS
#logo_container
{
padding: 0px;
overflow: hidden;
zoom: 1;
}
#logo_image
{
float: left;
background-color: transparent;
border: 1px solid red;
}
#logo_address
{
background-color: #0E4194;
color: #FFFFFF;
margin-left: auto;
padding: 0px;
float: right;
border: 1px solid red;
height: 150px;
}
答案 0 :(得分:0)
#logo_address
{
background-color: #0E4194;
color: #FFFFFF;
padding: 0px;
textalign: right;
float: left;
border: 1px solid red;
height: 150px;
width: ENTER VALUE HERE;
}
这将是一个解决方案。如果将#logo_address浮动到左侧,请将文本向右对齐并输入您想要的宽度值。
答案 1 :(得分:0)
您需要将背景颜色设置为#logo_container
而不是#logo_address
。这将为整个包装器div提供背景颜色,包括两个子元素之间的空间。