Главная страница
    Top.Mail.Ru    Яндекс.Метрика
Текущий архив: 2007.10.28;
Скачать: CL | DM;

Вниз

Вопрос по HTML   Найти похожие ветки 

 
SerJaNT ©   (2007-09-27 03:06) [0]

Нужно в одну строку вывести несколько вот таких блоков:

<img src="images/sss.gif" border="0" width="40" height="40" align="left"> строка номер раз<br>строка номер два

Если я тупо сделаю так:

<img src="images/sss.gif" border="0" width="40" height="40" align="left"> строка номер раз<br>строка номер два
<img src="images/sss.gif" border="0" width="40" height="40" align="left"> строка номер раз<br>строка номер два
<img src="images/sss.gif" border="0" width="40" height="40" align="left"> строка номер раз<br>строка номер два
и т.д.

то хер знает что получится... Рисунки и текст как-бы "ступеньками" выводятся, а хотелось бы чтобы нормально в одну строку, т.е. идет рисунок, напротив две строчки текста, рисунок, две строчки текста и т.д...

Как такое сделать?


 
Zeqfreed ©   (2007-09-27 05:25) [1]

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
   <title></title>
   <meta http-equiv="content-type" content="text/html;charset=utf-8" />
   <link rel="stylesheet" type="text/css" media="screen" href="/screen.css">
       <style>
               dl {
                       width: 220px;
               }

               dt {
                       display: block;
                       float: left;
                       clear: left;
               }

               dd {
                       display: block;
                       float: right;
                       clear: right;
                       width: 170px;
               }

               dt img {
                       border: 1px solid #ccc;
                       width: 40px;
                       height: 40px;
               }
       </style>
</head>
<body>
<dl>
<dt><img src="1.png"></dt>
<dd>раз два три<br/>три два раз<dd>
<dt><img src="2.png"></dt>
<dd>пять шесть семь<br/>десять десять десять</dd>
</dl>
</div>
</body>
</html>


Как-то так. Ну доработать самому нужно, а то я еще не проснулся.


 
homm ©   (2007-09-27 07:38) [2]

> [0] SerJaNT ©   (27.09.07 03:06)

Таблицы.


 
SerJaNT ©   (2007-09-28 02:36) [3]

> [1] Zeqfreed ©   (27.09.07 05:25)


Всё хорошо, но вот только надо чтобы это все было в одну строчку (пример - http://www.ii4.ru/images/749711sample.GIF).

Таблицы использовать нельзя по определенным причинам.


 
homm ©   (2007-09-28 05:06) [4]

> [3] SerJaNT ©   (28.09.07 02:36)
> Таблицы использовать нельзя по определенным причинам.

Раз эти причины определены, наверное они могут быть озвучены?


 
homm ©   (2007-09-28 05:11) [5]

Есть способ, но он заведомо кривее таблиц.

<style>
div {float:left;}
</style>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>


 
Бакук ©   (2007-09-28 07:52) [6]

> но он заведомо кривее таблиц

Ну почему он кривее? Блочная верстка&#133


 
homm ©   (2007-09-28 14:40) [7]

> [6] Бакук ©   (28.09.07 07:52)
> Ну почему он кривее?

Смотрим:
<style>
div {float:left;}
</style>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>
<div><img src="" border="1" width="40" height="40" align="left"> строка номер раз<br>строка номер два</div>


 
Альберт_   (2007-09-28 15:59) [8]

не проще ли img align=absmiddle и проблем-то...


 
SerJaNT ©   (2007-09-28 16:12) [9]

> [8] Альберт_   (28.09.07 15:59)


и что? а как несколько рисунков в одну строчку вывести?


 
SPeller ©   (2007-09-28 16:25) [10]

<style>
img.oneline { display: block; float: left; }
</style>
<body>
<img ... class="oneline" /><img ... class="oneline" /><img ... class="oneline" /><img ... class="oneline" /><img ... class="oneline" /><img ... class="oneline" />
<div style="clear:left"></div>


Делов-то :)


 
Альберт_   (2007-09-28 16:32) [11]

>и что? а как несколько рисунков в одну строчку вывести?

к каждому по атрибуту. и выглядит  вау



Страницы: 1 вся ветка

Текущий архив: 2007.10.28;
Скачать: CL | DM;

Наверх




Память: 0.48 MB
Время: 0.04 c
3-1182402966
Xmen
2007-06-21 09:16
2007.10.28
TreeView и данные из таблицы


2-1191918318
Riply
2007-10-09 12:25
2007.10.28
Внутренняя механика работы NtOpenFile.


2-1191341870
Pacific
2007-10-02 20:17
2007.10.28
Ошибка(


2-1191302087
Ping
2007-10-02 09:14
2007.10.28
Понизить приоритет сообщения в очереди окна


2-1191399713
Pacific
2007-10-03 12:21
2007.10.28
Integer to Char





Afrikaans Albanian Arabic Armenian Azerbaijani Basque Belarusian Bulgarian Catalan Chinese (Simplified) Chinese (Traditional) Croatian Czech Danish Dutch English Estonian Filipino Finnish French
Galician Georgian German Greek Haitian Creole Hebrew Hindi Hungarian Icelandic Indonesian Irish Italian Japanese Korean Latvian Lithuanian Macedonian Malay Maltese Norwegian
Persian Polish Portuguese Romanian Russian Serbian Slovak Slovenian Spanish Swahili Swedish Thai Turkish Ukrainian Urdu Vietnamese Welsh Yiddish Bengali Bosnian
Cebuano Esperanto Gujarati Hausa Hmong Igbo Javanese Kannada Khmer Lao Latin Maori Marathi Mongolian Nepali Punjabi Somali Tamil Telugu Yoruba
Zulu
Английский Французский Немецкий Итальянский Португальский Русский Испанский