html - 框内 CSS 对齐

Question

我正在尝试将按钮和 div 底部的一些文本对齐，就像下面的示例中的价格和 checkout 按钮一样。最好的方法是什么。我制作了一个 div，对其设置了样式以获得正确的文本和图片。我只需要将按钮附加到右侧，将价格附加到左侧，使它们相互对齐。

类似于thisiswhyimbroke.com网站上的产品展示

http://www.thisiswhyimbroke.com/

^^ 价格和 Check It Out 按钮。我如何实现这一目标？

Answer 1

像这样尝试: DEMO

首先尝试使用 reset your CSS。

CSS:

*{
    padding:0;
    margin:0;
}
#priceAndButton {
    width:100%;
    display:block;
    height:30px;
    line-height:30px;
}
#priceAndButton h4 {
    float:left;
    vertical-align:middle;
}
#priceAndButton img {
    float:right;
}

希望对你有帮助