От куда берутся отступы между div если margin:0 и padding:0?
Чередуются 2 элемента div и между ними есть отступы, хотя padding:0 и margin:0
Подскажите: от куда берутся отступы между div.album и div.album_separator и как удалить эти отступы?
<style>
div#album_list{
overflow-x: scroll;
height: 225px;
width: 800px;
white-space: nowrap;
background-color: red;
border: 2px solid black;
position: relative;
}
div.album{
display: inline-block;
background-color: blue;
width: 200px; height: 200px;
padding: 0px; margin: 0px; /*отступы по нулю*/
border: none;
}
div.album_separator{
display: inline-block;
height: 200px; width: 20px;
background-color: white;
padding: 0px; margin: 0px; /*отступы по нулю*/
border: none;
}
</style>
<div id='album_list'>
<div class="album">1</div>
<div class="album_separator"> </div>
<div class="album"> </div>
<div class="album_separator"> </div>
<div class="album"> </div>
<div class="album_separator"> </div>
<div class="album"> </div>
<div class="album_separator"> </div>
<div class="album"> </div>
<div class="album_separator"> </div>
</div>
|
shurik_shink,
Потому что inline-block и между ними <div class="album">1</div> <div class="album_separator"> </div> есть перенос строки. А удалить очень просто. Либо записать всё в одну строчку (код не читаем) либо так
<style>
div#album_list{
overflow-x: scroll;
height: 225px;
width: 800px;
white-space: nowrap;
background-color: red;
border: 2px solid black;
position: relative;
}
div.album{
display: inline-block;
background-color: blue;
width: 200px; height: 200px;
border: none;
}
div.album_separator{
display: inline-block;
height: 200px; width: 20px;
background-color: white;
border: none;
}
</style>
<div id='album_list'>
<div class="album">1</div><!--
--><div class="album_separator"> </div><!--
--><div class="album"> </div><!--
--><div class="album_separator"> </div><!--
--><div class="album"> </div><!--
--><div class="album_separator"> </div><!--
--><div class="album"> </div><!--
--><div class="album_separator"> </div><!--
--><div class="album"> </div><!--
--><div class="album_separator"> </div>
</div>
|
Спасибо
|
Цитата:
<div class="album">1</div><div class="album_separator"> </div><div .... |
font-size: 0 для родителя.
|
| Часовой пояс GMT +3, время: 12:23. |