-1

メールで送信する HTML ニュースレターを作成しています。

CSS

.kasten {
    color: #000;
    display: inline-block;
    border-size: 1px;
    border-style: solid;
    border-radius: 10px;
    border-color: #493c2a;
    margin: 7px;
    padding: 0px;
    box-shadow: 0px 0px 10px #222;
    width: 300px;
    height: 300px;
    text-decoration: none;
}

HTML

<div class="kurse">
    <a class="kasten" href="#">
        <!-- content -->    
    </a>
    <a class="kasten" href="#">
        <!-- content -->    
    </a>
    <a class="kasten" href="#">
        <!-- content -->    
    </a>
</div>

問題は、ブロックが 1 行で表示されず、何らかの「バンプ」が表示されることです。

これを修正する方法を知っている人はいますか？

4

3 に答える 3

4

上に揃える必要があります

.kasten {
    vertical-align: top;
}

http://jsfiddle.net/Gh5ez/2/

于 2013-08-21T18:02:54.790 に答える
1

メールと言えばメールですか？もしそうなら、下のリンクを見てください。メーラーで CSS をサポートするためのギルドです。

http://www.campaignmonitor.com/css/

于 2013-08-21T18:46:09.817 に答える
0

display:inline-block を削除して float:left に追加することができます

.kasten {
  color: #000;
  float:left;
  border-size: 1px;
  border-style: solid;
  border-radius: 10px;
  border-color: #493c2a;
  margin: 7px;
  padding: 0px;
  box-shadow: 0px 0px 10px #222;
  width: 300px;
  height: 300px;
  text-decoration: none;
}

私は修正でjsfiddleを作りました

于 2013-08-21T18:00:07.583 に答える