Выравнивание текста под изображением

Я хочу выровнять текст под изображением, но значок слева. Всякий раз, когда я помещаю в него пробел-левый или правый или маркер, он сосредотачивается на одном блоке, но не на обоих. Это действительно раздражает. Вы можете увидеть на этом скриншоте: http://cl.ly/1G0D191t1G3V1v0a0K2q Выравнивание текста под изображением

HTML:

<html xmlns="http://www.w3.org/1999/html"> 
<head> 
    <link href="<?php echo base_url('css/style.css');?>" rel="stylesheet" type="text/css" /> 
    <title>Admin :: Home</title> 
</head> 
<body> 
<div id="wrapper"> 
    <div class="admin-form"> 
    <div class="header"> 
     <h1>Admin Home</h1> 
    </div> 
    <div class="content dashboard clearfix"> 
     <ul> 
     <li><a href='<?php echo base_url('admin/DiveLocations');?>'><img src='<?php echo base_url('images/icons/duikplaats.png');?>'/>Duiklocaties</a></li> 
     <li><a href='<?php echo base_url('admin/DiveEvents');?>'><img src='<?php echo base_url('images/icons/scubadiving.png');?>'/>Duiken</a></li> 
     <li><a href='<?php echo base_url('admin/Users');?>'><img src='<?php echo base_url('images/icons/users.png');?>'/>Gebruikers</a></li> 
     </ul> 
    </div> 

    </div> 
</div> 
</body> 
</html>

CSS:

.dashboard img { 
    display: block; 
    margin-left:25px; 
} 

.dashboard ul li { 
    list-style-type: none; 
    float: left; 
    padding: 0 10px 0 0; 
}

источник

2012-05-24 Bart De Kimpe

В этом случае я бы поместить текст в <span> и ясно, что:

.dashboard span { 
    clear:both; 
    display:block; 
}

Я сделал для вас скрипку - http://jsfiddle.net/JMEMc/

источник

2012-05-24 09:58:02 Alex

Спасибо, я использовал промежуток раньше, потому что я знал, что это может быть достигнуто с помощью span, моя единственная ошибка заключалась в том, что я поместил диапазон вокруг всего и текста –

Выравнивание текста под изображением

ответ

Смежные вопросы