Question

我正试图将2个div并排，当我试图将它们放入时，它们只是落在彼此之下。一个div正在创造一个自己的边缘来推动其他人，我如何并排获得它们？

HTML：

var height =  $(window).scrollTop();
console.log("current height " + height);

$('#calendar').fullCalendar(  'removeEvents');
$('#calendar').fullCalendar(  'addEventSource', e);
$('#calendar').fullCalendar(  'addEventSource', holiday);
$('#calendar').fullCalendar(  'refetchEvents');

window.scrollTo(0,height);
console.log("scroll to " + height);

Answer 1

div元素默认为块级元素。给予宽度不足以使它们成为＆＃34;内联＆＃34;元素。为此，您需要将display属性更改为inline-block。

.teams {
    width: 250px;
    margin: 0;
    display: inline-block;
}

检查此fiddle

Answer 2

在父类

中添加display: inline-block;

.teams {display: inline-block; margin: 0; width: 250px;}

Answer 3

我为你写了一个代码。这个。只是复制和粘贴。这对你有帮助。

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>

<style type="text/css">

   div.left{
    width:500px;
    height: 600px;
    position: absolute;
    left: 5%;
    box-shadow: 1px 2px 1px black;
   }

   div.left img{
    width: 100%;
    height: 500px;
   }

   div.right{
    width:500px;
    height: 600px;
    position: absolute;
    right: 5%;
    box-shadow: 1px 2px 1px black;

   }

     div.right img{
    width: 100%;
    height: 500px;
   }

</style>

<body>
 <div class="maindiv">
    <div class="left">
        <img src="https://i.ytimg.com/vi/QGiJFumHUPo/maxresdefault.jpg">
        <p>your description</p>
    </div>
    <div class="right">
        <img src="http://media1.santabanta.com/full1/Countries/Places/places-126a.jpg">
        <p>your descripion</p>
    </div>


 </div>

</body>
</html>

Div本身就是一个保证金？

3 个答案: