Имя пользователя:
Пароль:
 | Правила  

Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » [решено] Вёрстка подписи в письме. div без переноса на новую стоку

Ответить
Настройки темы
[решено] Вёрстка подписи в письме. div без переноса на новую стоку

Аватара для Tonny_Bennet

Ветеран


Сообщения: 1384
Благодарности: 178


Конфигурация

Профиль | Отправить PM | Цитировать


Здравствуйте.

Решил сверстать подпись для компании и столкнулся с одной проблемой. Подпись выглядит так:

Цитата:
С уважением,
Василий Пупкин
супермегаадминище всея сети
раб. тел. +7(456)123-45-67
моб. тел. +7(456)987-65-43
ICQ 123 456 789
www.myvebsite.ru
Но в одном из филиалов компании несколько рабочих телефонов и было решено сделать одну надпись "раб.тел." и все телефоны вровень с самым первым выстроить. Как сделать таблицей я знаю:

Код: Выделить весь код
<table border="0px">
	<tr>
		<td>раб.тел.</td> <td>+7(456)123-45-67<td>
	</tr>
	<tr>
		<td></td> <td>+7(456)123-45-67</td>
	</tr>
</table>
Хочется сделать одним div-ом. Если использовать nowrap, то внутри него строки тоже не переносятся. Подскажите пожалуйста как быть.

-------
Сообщение оказалось полезным? Кнопка Полезное сообщение располагается чуть ниже.


Отправлено: 13:12, 11-01-2013

 

Вредитель


Сообщения: 460
Благодарности: 126

Профиль | Отправить PM | Цитировать


Тэг <pre> не подойдет?

-------
Все сказаное является только моим личным мнением.


Отправлено: 14:17, 11-01-2013 | #2



Для отключения данного рекламного блока вам необходимо зарегистрироваться или войти с учетной записью социальной сети.

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


Аватара для Tonny_Bennet

Ветеран


Сообщения: 1384
Благодарности: 178

Профиль | Отправить PM | Цитировать


DedAlex, вы предлагаете пробелами набить отступы?

И ещё одно замечание:
Цитата:
Элемент <pre> определяет блок предварительно форматированного текста. Такой текст отображается обычно моноширинным шрифтом и со всеми пробелами между словами. По умолчанию, любое количество пробелов идущих в коде подряд, на веб-странице показывается как один. Тег <pre> позволяет обойти эту особенность и отображать текст как требуется разработчику.
Этот тег изменяет шрифт и текст телефонов выделяется на фоне основного текста подписи.

-------
Сообщение оказалось полезным? Кнопка Полезное сообщение располагается чуть ниже.


Отправлено: 15:44, 11-01-2013 | #3


Старожил


Сообщения: 169
Благодарности: 27

Профиль | Сайт | Отправить PM | Цитировать


А почему просто не использовать тег переноса строки <br>?

Код: Выделить весь код
<div>  
...  
раб. тел. +7(456)123-45-67<br>  
моб. тел. +7(456)987-65-43<br> 
ICQ 123 456 789  
</div>

Отправлено: 12:16, 12-01-2013 | #4


Ветеран


Сообщения: 27449
Благодарности: 8088

Профиль | Отправить PM | Цитировать


softter, потому что набор информации иной:
Код: Выделить весь код
<div>  
...  
раб. тел. +7(456)123-45-67<br>  
моб. тел. +7(456)987-65-43<br> 
+7(456)bla-bla-bla<br> 
+7(456)bla-bla-bla<br> 
ICQ 123 456 789  
</div>

Отправлено: 13:15, 12-01-2013 | #5


Вредитель


Сообщения: 460
Благодарности: 126

Профиль | Отправить PM | Цитировать


Цитата Tonny_Bennet:
DedAlex, вы предлагаете пробелами набить отступы? »
Да.
Цитата Tonny_Bennet:
Этот тег изменяет шрифт и текст телефонов выделяется на фоне основного текста подписи. »
Я предлагал все засунуть в pre.
Код: Выделить весь код
<pre>
С уважением,
Василий Пупкин
супермегаадминище всея сети
раб. тел. +7(456)123-45-67
моб. тел. +7(456)987-65-43
          +7(456)987-65-43
          +7(456)987-65-43
ICQ 123 456 789
www.myvebsite.ru
</pre>

-------
Все сказаное является только моим личным мнением.

Это сообщение посчитали полезным следующие участники:

Отправлено: 19:48, 12-01-2013 | #6


Аватара для Tonny_Bennet

Ветеран


Сообщения: 1384
Благодарности: 178

Профиль | Отправить PM | Цитировать


DedAlex, запихнул всё в pre. Приемлемо, но есть одно "НО":

можно ли запретить тегу <pre> изменять шрифт? сделать так что бы он его наследовал от родительского элемента.

-------
Сообщение оказалось полезным? Кнопка Полезное сообщение располагается чуть ниже.


Отправлено: 12:01, 17-01-2013 | #7


Аватара для Tonny_Bennet

Ветеран


Сообщения: 1384
Благодарности: 178

Профиль | Отправить PM | Цитировать


Сделал через добавление свойства font: inherit !important; в стиль тега pre. Но т.к. шрифт уже не моноширинный вёрстка пробелами поплыла. Переделал всё в тегах table.

Код: Выделить весь код
<style>
table {
 font: inherit !important;
 color: inherit !important;
 margin: -3 !important;
}

.block1 { 
 padding: 0px;
 margin-left: 2px;
 margin-top: 5px;
}
</style>
<a href="www.myvebsite.ru"><img src="data:image/png;base64, код_логотипа"></a><br>
<div class="block1">
С уважением,<br>
Имя Фамилия<br>
должность<br>
<table border="0px">
<tr>
	<td>раб.тел.</td><td>+7(NNN)NNN-NN-NN</td>
</tr>

<tr>
	<td></td> <td>+7(NNN)NNN-NN-NN</td>
</tr>

<tr>
<td>моб.тел.</td><td>+7(NNN)NNN-NN-NN</td>
</tr>
</table>
ICQ NNN NNN NNN<br>
<a href="www.myvebsite.ru">www.myvebsite.ru</a>
</div>

-------
Сообщение оказалось полезным? Кнопка Полезное сообщение располагается чуть ниже.


Последний раз редактировалось Tonny_Bennet, 18-01-2013 в 11:53.


Отправлено: 14:53, 17-01-2013 | #8



Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » [решено] Вёрстка подписи в письме. div без переноса на новую стоку

Участник сейчас на форуме Участник сейчас на форуме Участник вне форума Участник вне форума Автор темы Автор темы Шапка темы Сообщение прикреплено

Похожие темы
Название темы Автор Информация о форуме Ответов Последнее сообщение
VBS/WSH/JS - [решено] Как прикрепить несколько файлов в письме? staw2ros Скриптовые языки администрирования Windows 23 25-02-2013 01:44
Вопрос - вирус в письме VictorSh Лечение систем от вредоносных программ 3 02-08-2012 01:09
Сильно едет вёрстка в Opera geforester Вебмастеру 1 14-09-2010 09:26
[решено] В IE6 едет вёрстка... Sanchos Вебмастеру 1 21-02-2010 20:22
V. 2007 - Фотография пользователя в письме Sheffand Microsoft Exchange Server 13 20-04-2009 17:28




 
Переход