以下是我的代码:

<div id="footer">
<div id="left_footer">
<div id="img_left" align="center">
<img src="separator_bar.jpg" align="middle"/>
</div>
</div>
<div id="right_footer">
<div id="img_right" align="center">
<img src="separator_bar.jpg" align="middle"/>
</div>
</div>
</div

CSS:

#footer {
    width:500px;
    position:relative
}
#left_footer{
    float:left;
}
#right_footer{
    float:right;
}

我正在尝试这个代码,但是我的图像没有对齐到中心,它始终在左侧页脚左侧对齐,右侧右侧对齐。 请指教!

===============>>#1 票数:3 已采纳

我会像这样接近布局:

http://jsfiddle.net/yWmZ5/1/

HTML

<div id="footer">
    <div id="left_footer">
        <img src="http://placekitten.com/100/100" />
    </div>
    <div id="right_footer">
        <img src="http://placekitten.com/100/100" />
    </div>
</div>

CSS

#footer { width:500px; position:relative; overflow:hidden; }
#left_footer{ width:250px; float:left; text-align:center; background:orange; }
#right_footer{ width:250px; float:right; text-align:center; background:yellow; }

确保从HTML中删除所有样式(例如 - 对齐等)并将其放入CSS中。

===============>>#2 票数:0

试试这种风格:

#footer > div{width:50%}

===============>>#3 票数:0

你的div#left_footerdiv#right_footer需要有一些宽度,以便在中间显示内容

将您对应的css更改为:

#left_footer{
    text-align:center;
    float:left;
    width:50%;

    }
#right_footer{
    float:right;
    width:50%;

}

看到这个小提琴

  ask by abhinav singh translate from so

未解决问题?本站智能推荐:

2回复

左对齐和中心对齐div

我想左对齐图像,居中对齐div中的文本。 但我得到: 文本“这不是居中”不完全居中。 HTML如下: 和CSS: 我怎样才能准确地居中显示文字?
3回复

在div中对齐3个图像中心

我有使用角度材料库的代码html: <div layout="row" layout-wrap style="background: yellow; "> <div ng-repeat="pro in Products" > <md-card cla
3回复

输入左对齐,在div的中心

我试图将我的输入部分对齐到div的中心,使标签在输入的左侧对齐。 我似乎无法使输入部分在div的中心彼此对齐。 忍受我,我对任何类型的编码都是新手,因此我的代码可能不是最好的。 到目前为止,这是我的html和css:这就是我想要的样子。 标签在左侧,输入字段在中间。 IMG
3回复

如何将div中的ul与中心对齐左对齐?

我的无序列表对齐方式有问题。 我希望左对齐我的无序列表,但仍保持父母div的居中对齐。 .images img { width: 290px; } .images ul { padding: 0px; margin: 0px; } .images li { list-style
2回复

左,右和中心对齐的div

我正在尝试创建一个页面,该页面具有连续3个div,这些div左右对齐并且居中。 我尝试使用float:left和float:right但效果确实很糟糕。 该页面可超级随机缩放,我希望当页面缩小时div分成2列,然后移动设备的div变为1列。 .container { di
3回复

将div左对齐,水平头对齐中心,将div右水平对齐

我有一个div,h1和div的css标头。 我面临着一个挑战,即将div内容左对齐,标题放在中心,第二个div水平对齐到右,第二个div的内容彼此叠放。 CSS片段 html片段 波纹管是我正在尝试的插图 请协助!
1回复

Bootstrap 4中心图像,但文本左对齐

我正在使用Bootstrap 4,并且有这样的行: <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrit
6回复

如何使div中心与div左对齐?

我在页面中有一个父Div中心对齐,并且根据结果将内容动态添加到父Div中。 父div的宽度为100%,位于页面的中心,并且预期结果应为 但是结果是 .row { width: 100%; text-align: center; } .block { displa
2回复

左对齐a

我正在尝试创建一个带有几个<div>块的网页,这些块根据下图用CSS对其样式进行设置。 但是我不知道如何完成这项工作。 我已经按照答案( https://stackoverflow.com/a/26599439/478406和https://stackoverflow.com/a
4回复

设置div宽度,对齐div中心和文本左对齐

我有一个小问题,但我无法解决它。 我有一个864像素宽的内容标题,一个重复的背景图像-Y和页脚图像。 现在我在背景图像上有这个<div> ,我希望它像855px宽度,文本对齐左边但是对齐中心,所以它适合bg。 我曾经有过一些填充左边的宽度,但我发现这是我的屏幕分辨率的正确填