Question

我有两个div：

   <a href="http://google.com">
     <div id="tabel_albastru_produits">
        <p id="client1">Clients privés</p>
        <div id="paragraf_1">DeLumine propose différents produits pour les clients privés répartis en trois gammes.<br>Nous nous efforçons de vous proposez la solution la plus adequate possible. Notre objectif est de garantir une autonomie énergétique fiables, durable et écologique.</div>

</div>
</a>


   <a href="http://google.com">
      <div id="tabel_verde_produits">
      <p id="client2">Clients professionels</p>
      <div id="paragraf_2">Dans le but de répondre aux besoins spécifiques des entreprises, et de certains particuliers, nous proposons une installation sur mesure. Ainsi, un technicien DeLumine procède à l’analyse de vos besoins en énergie électrique en vue de vous proposer une solution concrète et personnalisée.”</div></a>

</div>

这是代码CSS：

  #tabel_verde_produits
{
        width: 402px;
        display:inline-block;
        background: #8CC63F;
        margin-left: 10px;
        vertical-align:top;
        margin-top:40px;
        padding-bottom:40px;
        margin-left:50px;

}



#tabel_albastru_produits
{
        width:431px;
        display:inline-block;
        background: #264572;
        vertical-align:top;
        margin-top:40px;
        padding-bottom:61px;
        margin-left:50px;
}

http://jsfiddle.net/wxhbbw0y/

我想修复这两个div内联网站

如果删除谷歌这两个div的链接，请排列表格

基本上我想把它们放在行和工作链接

这是网站：

http://dl.dg-site.com/produits-et-services/

你能帮我解决这个问题吗？

提前致谢！

Answer 1

我建议你先看看float

通过这种方式，您可以轻松地并排渲染元素。

div.1  {
    float: right;
}

您需要创建一个容器元素来控制浮动div。

<div class="1"> 
<div>1
</div>
<div class="1">2
</div>
</div>

Answer 2

这是我的笔，我建议你使用bootstrap。它是一个html，css，javascript框架。它响应迅速，并且大部分都是繁重的。看看这个。 http://www.bootply.com/0yoAlNcOrW

/* CSS used here will be applied after bootstrap.css */
.blue {
margin: 20px;
    background: #264572;
    padding: 20px;
    color: #fff;
  }

  .green {
      margin: 20px;
      background: #8cc63f;
       padding: 20px;
      color: #fff;
    }
<div class="wrapper">
  <div class="container">
    <div class="col-sm-6">
      <div class="blue">
        <p id="client2">Clients professionels</p>
<div id="paragraf_2">Dans le but de répondre aux besoins
  spécifiques des entreprises, et de certains particuliers, 
  nous proposons une installation sur mesure. Ainsi, un 
  technicien DeLumine procède à l’analyse de vos besoins en énergie 
  électrique en vue de vous proposer une solution 
  concrète et personnalisée.”</div>



      </div>


    </div>

    <div class="col-sm-6">
      <div class="green">
        <p id="client2">Clients professionels</p>
<div id="paragraf_2">Dans le but de répondre aux besoins
  spécifiques des entreprises, et de certains particuliers, 
  nous proposons une installation sur mesure. Ainsi, un 
  technicien DeLumine procède à l’analyse de vos besoins en énergie 
  électrique en vue de vous proposer une solution 
  concrète et personnalisée.”</div>

      </div>


    </div>

  </div>
</div>

如何为这个div添加链接？

2 个答案: