Question

我有这段代码：http://jsfiddle.net/Ninjacu/t9r9S/4/

这是

<div class="gamedes">
    <img class="miniaturas"src="http://thumbs.mochiads.com/c/g/coaster-racer-3/_thumb_200x200.png">
        <a class="gamede" src="google.es">Hola</a>
        <div class="description">Description about 120 caracters</div><br><br><br><br>
        </div>

        <div class="gamedes">
    <img class="miniaturas"src="http://thumbs.mochiads.com/c/g/coaster-racer-3/_thumb_200x200.png">
        <a class="gamede" src="google.es">Hola</a>
        <div class="description">Description about 120 caracters</div><br><br><br><br>
        </div>

我想把第二个图像，标题和文字放在第一个旁边，就像两列一样。

我不明白为什么我不能这样做，因为我尝试了所有我认识的方法，但它不起作用。

任何解决方案？

Answer 1

你试过浮动div吗？

.gamedes {
  float:left
}

Answer 2

您可以使用display: inline-block;

Fiddle

.gamedes{
    display: inline-block;
}

另外，我在html

上修改了一下

Answer 3

首先给它们特定的宽度，然后浮动它们就像这样。

.gamedes{
  width:200px;
  float:left;
}

Answer 4

试试这个

.miniaturas {
    display: inline-block;
    border-radius: 10px;
}

.description {
    font-size: 15px;
    background-color: #A4A4A4;
    display: inline;
    border-radius: 3px;
    margin-left: 5px;
    width: 10%;
}

.gamede{
    font-size: 20px;
    font-weight: bold;
    margin-left: 5px;
}

.gamedes {
    float:left;
}

Answer 5

HTML：

<div class="gamedes">
    <img class="miniaturas"src="http://thumbs.mochiads.com/c/g/coaster-racer-3/_thumb_200x200.png"><br />
        <a href="#" class="gamedes" src="google.es">Hola</a><br />
  <div class="description">Description about 120 caracters</div>
</div>
<div class="gamedes">
    <img class="miniaturas"src="http://thumbs.mochiads.com/c/g/coaster-racer-3/_thumb_200x200.png"><br />
        <a href="#" class="gamedes" src="google.es">Hola</a><br />
  <div class="description">Description about 120 caracters</div>
</div>

CSS：

.gamedes{
   float: left;
   margin-left: 10px;
}
.miniaturas {
    border-radius: 10px;
}

.description {
    font-size: 15px;
    background-color: #A4A4A4;
    border-radius: 3px;
    margin-left: 5px;
}

此处的结果：http://jsfiddle.net/2kXFH/

把div放在另一个div旁边

5 个答案: