Как выровнять текст с рисунком?

как я могу выровнять текст под изображением следующим образом? Как выровнять текст с рисунком?

HTML:

<span class="test"> 
    <img src="http://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]?v=73d79a89bded&a" alt="asd" width="316" height="316"> 
    Lorem Ipsum is simply dummy text of the printing and typesetting 
    industry. Lorem Ipsum has been the industry's standard dummy text ever since 
    the 1500s, when an unknown printer took a galley of type and scrambled it to 
    make a type specimen book. 
</span>

CSS:

.test{ 
    display:block; 

} 
.test img{ 
    display:block; 
    position: relative; 
    left: 50px; 
}

источник

2016-06-22 Aurimas

Я не получил вас. Вы пытаетесь изменить изображение с помощью css? –

Добавить в img 'margin: 0 auto;' –

переместить текст из диапазона ... тогда он будет по всей ширине родительского элемента – demo

Является ли это то, что вы хотите?

HTML:

<span class = "test"> 
    <img src="http://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]?v=73d79a89bded&a" alt="asd" width="316" height="316"> 
    <span class="test_text"> 
     Lorem Ipsum is simply dummy text of the printing and typesetting 
     industry. Lorem Ipsum has been the industry's standard dummy text ever since 
     the 1500s, when an unknown printer took a galley of type and scrambled it to 
     make a type specimen book. 
    </span> 
</span>

CSS:

.test{ 
    width: 50%; 
} 
img{ 
    float: right; 
} 
.test.test_text{ 
    float: left; 
}

Вы можете видеть, что это работает here

источник

2016-06-22 09:38:10 hulkinBrain

простой способ я мог думать, я использовал таблицу только, чтобы дать вы идете, но вы должны использовать div и установить маржу слева.

<span class="test2"><img src="http://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]?v=73d79a89bded&amp;a" alt="asd" width="316" height="316" /></span> 
    <table width="510" height="100" border="0"> 
     <tr> 
     <td width="63" height="96">&nbsp;</td> 
     <td width="437"><span class="test111">Lorem Ipsum is simply dummy text of the printing and typesetting 
      industry. Lorem Ipsum has been the industry's standard dummy text ever since 
      the 1500s, when an unknown printer took a galley of type and scrambled it to 
      make a type specimen book. </span></td> 
     </tr> 
    </table>

источник

2016-06-22 09:40:22

Чтобы выровнять текст в левой, а затем изображение, которое вы можете создать его, используя Див элемент. Код под кодом css inline-

<div style="width:48%;float:left;vertical-align:bottom;margin:0px;">   
    Lorem Ipsum is simply dummy text of the printing and typesetting 
    industry. Lorem Ipsum has been the industry's standard dummy text ever since 
    the 1500s, when an unknown printer took a galley of type and scrambled it to 
    make a type specimen book. 
</div> 
<div style="width:50%;float:right;vertical-align:top;margin:0px;"> 
<img src="http://cdn.sstatic.net/Sites/stackoverflow/img/[email protected]?v=73d79a89bded&a" alt="asd" width="316" height="316"> 
</div>

источник

2016-06-22 09:43:50 IRSHAD

Как выровнять текст с рисунком?

ответ

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