两个相同的类div并排

时间:2013-11-25 18:01:06

标签: css html

如何使具有相同类的两个div浮动或并排出现在同一行中。该 问题是我无法添加额外的class / id。这两个div具有相同的默认类,无法更改。我不想使用javascript添加新的类/ ID。没有任何答案是在谷歌或堆栈溢出或任何其他地方显示如何使用相同的“类”如果有任何其他方式来添加类/ ID而不使用javascript也将赞赏。

3 个答案:

答案 0 :(得分:2)

两种最常见也很简单的方法是:

1。 float:left

示例:

.myDiv {
    float: left;
}

如果他们都符合这条线,他们会互相依赖。这种方法的缺点是父容器会混淆,这样父母之外的其他元素可能会流过它。在这种情况下,您必须使用clear-fix

2。 display:inline-block

示例:

.myDiv {
    display: inline-block;
}

float: left的结果非常相似,但div之间可能存在较小的空间,由 white-space 引起。 Here's more about this problem

答案 1 :(得分:1)

好吧,您可以为元素添加style属性,您可以在其中指定display:inline-blockfloat:left等。这一切看起来都像这样:

<div class="divclass" id="div1" style="float:left"> asd </div>

<div class="divclass" id="div2" style="float:left"> asd </div>

答案 2 :(得分:0)

http://jsfiddle.net/myc7N/1/

.myClass{
    width: 20%;
    float:left;
}
.someOtherClass{
    clear:both;
}