マージンがゼロに設定されているが、それはまだ

私のhtmlを示す2つのセクションがあり、マージンはゼロですが、それはまだそれが余裕はないマージンがゼロに設定されているが、それはまだ

.box1 { 
 
    width: 300px; 
 
    height: 450px; 
 
    background-color: green; 
 
    border: 0px; 
 
    display: inline-block; 
 
    margin: 0; 
 
    padding: 0px; 
 
} 
 

 
.box2 { 
 
    width: 150px; 
 
    height: 300px; 
 
    background-color: purple; 
 
    border: 0px; 
 
    display: inline-block; 
 
    margin: 0; 
 
    padding: 0px; 
 
}

<body> 
 
    <div class="box2"></div> 
 
    <div class="box1"></div> 
 
</body>

this is result

出典

2017-06-08 Mladen Milosavljevic

では、コード –

これを参照してくださいhttps://stackoverflow.com/questions/5078239/how-をいじることを削除しますか、インラインブロック要素間のスペースを取り除く – Tushar

これは関連しています：[インラインブロック要素間のスペースとの戦い]（https://css-tricks.com/fighting-the-space-between-inline-ブロック要素/） – AlexG

を示します。それはそれを表示するときに "スペース"に変換された新しい行です。これはdivのdisplay:inline-blockのためです。あなたのスペースを削除したり、divの間のコメント

.box1 { width: 300px; 
 
height: 450px; 
 
background-color: green; 
 
border: 0px; 
 
display: inline-block; 
 
margin: 0; 
 
padding: 0px; } 
 

 
.box2 { width: 150px; 
 
height: 300px; 
 
background-color: purple; 
 
border: 0px; 
 
display: inline-block; 
 
margin: 0; 
 
padding: 0px;}

<div class="box2"></div><!-- 
 

 
    --><div class="box1"></div>

出典

2017-06-08 10:47:26 XYZ

はい！それは知らなかった、TNX。 :)） –

@MladenMilosavljevic詳細はこちらをご覧くださいhttps://css-tricks.com/fighting-the-space-between-inline-block-elements/ – XYZ

マージンがゼロに設定されているが、それはまだ

答えて

関連する問題