-1

重複の可能性：
CSSスタイリング-これら2つのdivボックスを隣接させる方法

私は2つの段落をしなければなりません：

Para 1

Para 2

どうすれば次のように表示できますか？

Para1   Para2

自分のスペースとボックスの両方に。

これが私が欲しいものです。

   <div>
  <div class="block" id="profile">
  <h3>Professional Profile</h3>
  <p>Knowledge in all aspects of web application development. 
  My Skills to solve programming errors gets the job
  faster. Proficient in performance tuning database applications.</p>
  </div>

ここで何をしますか？

  <div class="block" id ="contact">
  <p>
  <h3> Contact</h3>
  <address>Written by W3Schools.com<br /><a href="mailto:rjohn5854@howardcc.edu">
  Email Me!!!</a><br />Address: Box 3223,City<br />Phone:6750</address>
  <p>
  </div>
  </div>

CSS


  div.block p  {
      display: inline-block;    
        }
4

3 に答える 3

3

display: inline-blockCSSプロパティなどを使用します。

p { display: inline-block; }

デモ

于 2012-09-14T18:45:27.093 に答える
1

あなたのCSSで：

.align-profile,
.align-contact
{
   display: inline-block;
   vertical-align: top; //also can try other align settings
   width: 45%;
}

.align-contact
{
   margin-left: 30px; //also try depending on the spacing you want between them
}

あなたのhtmlで：

<div class="align-profile">
   <h2>Profile</h2>
   para1
</div>
<div class="align-contact">
   <h2>Contact</h2>
   para2
</div>

これを行うには、divまたは段落を揃える必要があることに注意してください。divをdiv内に配置したり、段落を段落内に配置したりすると、機能しません。

于 2012-09-14T18:50:06.347 に答える
0

HTML段落タグ内

はブロック要素であるため、親要素のすべての幅を占めます。2つ手配できれば

1行でブロックするには、ブロックの動作をインラインに変更する必要があります。display: inlineまたはそれのためdisplay: inline-blockに。

于 2012-09-14T18:49:32.257 に答える