Question

我正在尝试创建图表键。

我正在使用css和html。

此刻，我有它所以关键标题显示旁边的参数，每个参数都有一个彩色方块和文字。

然而，它们没有对齐，我希望文本在彩色方块旁边。

要了解我的更多信息，请参阅此jsfiddle by clicking here或查看以下代码：

HTML：

<div class="asset-views-key">
<div class="asset-views-key-title">Key:</div>
<div class="asset-views-key-param">
    <div class="asset-views-key-square" style="background-color: #FF0000;"></div>Negative
</div>  
<div class="asset-views-key-param">
    <div class="asset-views-key-square" style="background-color: #00FF00;"></div>Positive
</div>
<div class="cb"></div>

CSS：

 .asset-views-key-square {
    width: 8px;
    height: 8px;
}
.asset-views-key-param {
    float: left;
    padding-right: 10px;
}
.asset-views-key-title {
    float: left;
    padding-right: 5px;
}

Answer 1

喜欢这个

<强> demo

<强> CSS

.asset-views-key{
    vertical-align:middle;       
    float:left;

}
.asset-views-key-square {
    width: 8px;
    height: 8px;
    float:left;
    margin:6px 7px;

}

Css对齐div和文本

1 个答案: