|
 198.6 Кб |
|
| Доброе время суток.
Подскажите пожалуйста в чем проблем. Не первый день ломаю голову.. Как убрать пробел между картинками.
Вот код
<style>
#mini_nav_right{
width:300px;
}
#mini_nav_right p a,#mini_nav_right p{
text-decoration: none;
display: block;
padding:0;
margin:0;
outline:0;
font-size:100%;
}
img.img{
padding:4px;
border:solid 1px #ddd;
background-color:#f2f2f2;
}
</style>
<aside id="mini_nav_right">
<p><a href="#"><img class="img" src="img/telephone_directory.jpg" height="35" width="300"></a></p>
<p><a href="#"><img class="img" src="img/CALENDAR_OF_EVENTS.jpg" height="35" width="300"></a></p>
<p><a href="#"><img class="img" src="img/schedule.jpg" height="35" width="300"></a></p>
<p><a href="#"><img class="img" src="img/Weather.jpg" height="35" width="300"></a></p>
</aside>
|
Скрин приложен | |
|
|
|
|
|
|
|
для: Sapun4ik
(05.12.2012 в 02:35)
| | всё хорошо сделали - код выложили, скрин приложили...
только вот какой-такой "пробел между картинками" (он же - "отступ") вам убрать надо - не объяснили
и в каком именно браузере проблема возникает - не написали
на скриншоте укажите стрелочкой (нарисуйте) | |
|
|
|
|
 208.8 Кб |
|
|
для: ЯСА
(05.12.2012 в 03:17)
| | Отступ указал. Он во всех браузерах. Я даже не могу отследить от чего он возникает.... | |
|
|
|
|
|
|
|
для: Sapun4ik
(05.12.2012 в 11:42)
| | padding:4px;
4 сверху + 4 снизу = 8 между картинками
---------
а вообще за такой код руки отрывать надо
код надо писать КРАСИВО | |
|
|
|
|
 243.7 Кб |
|
|
для: ЯСА
(05.12.2012 в 12:11)
| | Прошу прощение, скрин был не достоверен, исправил. Этот padding специально, ему и задам background.. Он делает рамку + обведен border 1px. А вот откуда отступ от border до border. Побывал убрать и padding и border. Отступ все равно есть. | |
|
|
|
|
|
|
|
для: Sapun4ik
(05.12.2012 в 12:53)
| | зачем вам в принципе нужен тег <p> ?
ссылку сделали display: block - значит, написанные подряд, они выстроятся по вертикали одна под одной
так зачем тег <p>?
-----
повторяю - код надо писать КРАСИВО:
<style>
#mini_nav_right {
width: 300px;
}
#mini_nav_right a {
text-decoration: none;
display: block;
padding: 0;
margin: 0;
outline-style: none;
}
#mini_nav_right a img {
width: 300px;
height: 35px;
padding: 4px;
border: solid 1px #ddd;
background-color: #f2f2f2;
}
</style>
<aside id="mini_nav_right">
<a href="#"><img src="img/telephone_directory.jpg"></a>
<a href="#"><img src="img/calendar_of_events.jpg" ></a>
<a href="#"><img src="img/schedule.jpg" ></a>
<a href="#"><img src="img/weather.jpg" ></a>
</aside>
|
| |
|
|
|
|
|
|
|
для: ЯСА
(05.12.2012 в 13:24)
| | Хорошо. Код красивый. Но отступ так и остался. 1 в 1 без изменений. | |
|
|
|
|
|
|
|
для: Sapun4ik
(05.12.2012 в 15:10)
| | Ну может у браузера есть какие-то свойства по-умолчанию для тега <aside>?
Попробуйте добавить:
#mini_nav_right{
padding:0;
margin:0;
}
|
| |
|
|
|
|
|
|
|
для: Sapun4ik
(05.12.2012 в 15:10)
| |
#mini_nav_right a {
text-decoration: none;
display: block;
padding: 0;
margin: 0;
outline-style: none;
font-size: 0;
line-height: 0;
}
|
| |
|
|
|
|
|
|
|
для: ЯСА
(05.12.2012 в 23:52)
| | Отлично! Огромное спасибо. Отступ пропал . | |
|
|
|