Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.04.2012, 00:27
Аватар для Isaac
Кандидат Javascript-наук
Отправить личное сообщение для Isaac Посмотреть профиль Найти все сообщения от Isaac
 
Регистрация: 03.08.2011
Сообщений: 106

РАботе с текстом.
Здравсвуйте.
Подскажите пожалуйста, столкнулся со следующей проблемой.
Есть верстка:
<style type="text/css">
#main {
    border: 1px solid black;
    width: 300px;
}
</style>
<body>
<div id="main">
    <p id="text">
        You can improve your ability to gatherto gatherto gather        
        <img id="image" src="blankslot.png" width="98" height="23" />        
        information by grouping like items into basic categories.
    </p>
</div>

вот что мі видем на картинке

проблема в том, что мне нужно расположите текст так, чтоб отступы между строками в той строке, где находится картинка были такими же ,как и отступы между строками, где нет картинки. Как видите на рисунке ниже, в строке с картинкой отступ сверху больше(показываю его красным цветом)

при єтом html-верстка не должна менятся, только можно менять css
Помогите пожалуйста, как я могу это сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 09.04.2012, 00:40
х.з
Посмотреть профиль Найти все сообщения от dmitriymar
 
Регистрация: 21.11.2010
Сообщений: 4,588

http://oooportal.ru/?cat=article&id=262
Ответить с цитированием
  #3 (permalink)  
Старый 09.04.2012, 10:41
Аватар для Isaac
Кандидат Javascript-наук
Отправить личное сообщение для Isaac Посмотреть профиль Найти все сообщения от Isaac
 
Регистрация: 03.08.2011
Сообщений: 106

line-height не подходит
Ответить с цитированием
  #4 (permalink)  
Старый 10.04.2012, 09:29
Лаборант :-)
Отправить личное сообщение для Pavel M. Посмотреть профиль Найти все сообщения от Pavel M.
 
Регистрация: 08.11.2011
Сообщений: 806

используйте отрицательный margin
на высоту строк картинка теперь влиять не будет совсем
но будет наползать на текст
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>title</title>
<style>
#main {
    border: 1px solid black;
    width: 300px;
}
  #main img { margin-top: -23px; }  

</style>
</head>
<body>
  <div id="main">
    <p id="text">
        You can improve your ability to gatherto gatherto gather       
        <img id="image" src="http://placehold.it/98x23" width="98" height="23" />       
        information by grouping like items into basic categories.
    </p>
  </div>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 07.05.2012, 17:24
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

Isaac, можно в изображение попробывать вписать:
align="absmiddle"

Ну а если через css, то можно попробывать прописать position:relative и margin-top: значение в px
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Возможности JavaScript при работе с графикой PetrS Общие вопросы Javascript 2 20.03.2012 18:33
Сколько у Вас есть свободного времени на работе? Duda.Ml1986@gmail.com Оффтопик 37 22.02.2012 11:56
проблема с событиями при работе с Ext.extend slavik27 ExtJS 1 04.09.2011 13:05
при наведении на ссылку всплывает полупрозрачная табличка с картинкой и с текстом JasSer Общие вопросы Javascript 17 24.11.2010 10:02
вопрос о работе getElementById(id) gosha_kap Общие вопросы Javascript 1 17.07.2009 07:23