-3

ここに私がフォーマットしようとしている私のフィドルがあります: jsfiddle

私は次のものを探しています:

  • logoとdivの間の距離text。プロパティを使用すると、margin-top比較的機能しません。
  • text改行で divの下にまたがります。これらのスパンを で分離すると、<br/>必要以上の距離が得られます。を変更するline-height propertyと、他のスパンに問題が生じます。line-heightそれぞれに指定がないことを願っていますspan
4

2 に答える 2

2

marginプロパティはあなたの答えです。スパン内の段落タグにテキストを配置し、そのように余白をカスタマイズします

p, span, div[name="logo"] {
    margin: 5px 2px 5px 2px;
}

マージンは時計回りに円形に設定されます。margin: 'top' 'right' 'bottom' 'left';

于 2012-12-19T14:01:51.947 に答える
0

Jfiddle でこれを使用します。

.box {
  background-color: #000000;
  color: #FF0000;
  width: 300px;
  height: 400px; 
  border-radius:5px;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  -o-border-radius:5px;
  -ms-border-radius:5px;
}
.logo{
    width:80%;
    margin:0% 4% 0% 15%;  
    font-size:20px;   
}
.inlineDiv{
    display:inline-block; 
    width:48%;
    vertical-align:middle;
    margin:0px;
    padding:0px;
}
.inlineDiv > img{
    float:right;   
}
#text{
     text-align:center;   
}

編集:

さらにhtml:

<div class="box">
<div class="logo">
  <div class="inlineDiv">
   <img src="c:\work\img\logo3.jpg" width="80" height="80" />
  </div>
  <div class="inlineDiv">
      <span class="spanTop">
          <p>YAD</p>
          <p>HIM</p>
      </span>
  </div>
   </div>
     <div id='text'>
         <span class="tag">
             <p>Try this now with the</p>
             <p> help of something then</p>
         </span>
  </div> 

</p>

于 2012-12-19T14:28:34.623 に答える