Как сделать вывод новстей в 2 колонки? | Вопросы и ответы

mario в рубрику HTML и CSS

14 октября 2009

Вопрос: Как сделать вывод новстей в 2 колонки?

Как сделать вывод новостей (категорий, и пр.) в две колонки только средствами css и html (минимум js).
Что бы они автоматический переходили на вторую колонку, скажем так, записывалось 2 туда 2 туда и тд... при условии минимум js, а именно спец тегов для вычисления, типа id="news1", id="news2" и так далее...

Ответы на вопрос — 16

Все зависит от того, как именно выводить. Ну проще всего, конечно, на сервере делать правильный массив

Grin, а если убрать программирование? Именно этого и хочется...

А как хочется вывести?
Так:
1 2
3 4

или так:
1 3
2 4

http://www.artlebedev.ru/tools/technogrette/html/list2columns/
По ссылке — страшный геморрой, я бы предпочел ручками запрограммировать перенос на javascript.

Grin, в принципе без разницы, но желательно
1 3
2 4

Тогда можно попробовать вот так (при разных высотах новостей будет смотреться криво):

<div style="float: left; width: 50%;">
<div class="news" id="news1"></div>
<div class="news" id="news2"></div>
</div>

<div style="float: left; width: 50%;">
<div class="news" id="news3"></div>
<div class="news" id="news4"></div>
</div>

Но, как видите, все равно придется в шаблоне вывода обрамлять новости из одного столбца в общий див

Grin, я вот не хотел что бы было news1, news2...,newsN...
И если есть возможность что бы не было разделения "общего" дива на две части )
чувствую нельзя так... (

Да, без разделения скорее всего не получиться сделать

Может подойдет такое
1 2
3 4

<style type="text/css">
ul li {
    float: left;
    width: 50%;
}
</style>

<ul>
    <li>Новость намбер оне</li>
    <li>Новость намбер тво</li>
    <li>Новость намбер тре</li>
    <li>Новость намбер фоур</li>
</ul>

Андрей, спасибо!) самое тО! )))

А у меня тут тож проблемка зародилась... Я то понял что либо через div лбо через li... но можно ли както на примере показать??? У меня просто код:

">

">

я таблицами режу на 2 строки... но проблема с том что слева и справа контент повторяеться... :( Как исправить??

А что код нельзя вставлятЬ?

Можно, но он должен быть внутри <pre><code>. В списке разрешенных тегов указано же ;-)

Андрей, спасибо тебе, очень помог

Андрей, Спасибо большое, то что искал...

Я вот тоже хочу вывести новости в две колонки.Но не понял это для WP или нет.Очень тяжело подходящее найти.

Новый ответ

как выглядит	какой тег
жирный текст	<b>жирный текст</b>
курсивный тект	<i>курсивный тект</i>
~~зачеркнутый текст~~	<s>зачеркнутый текст</s>
подчеркнутый текст	<u>подчеркнутый текст</u>
ссылка	<a href="адрес">ссылка</a>
`function foo() { ... }`	<pre><code>function foo() { ... } </code></pre>

разрешенные теги или посмотреть как будет выглядеть

Имя

Эл. почта используется для Граватарки

Сайт

Имя в Твиттере

Сообщение

как выглядит	какой тег
жирный текст	<b>жирный текст</b>
курсивный тект	<i>курсивный тект</i>
~~зачеркнутый текст~~	<s>зачеркнутый текст</s>
подчеркнутый текст	<u>подчеркнутый текст</u>
ссылка	<a href="адрес">ссылка</a>
`function foo() { ... }`	<pre><code>function foo() { ... } </code></pre>

разрешенные теги или посмотреть как будет выглядеть

Спонсоры

Блогорол

Вопрос: Как сделать вывод новстей в 2 колонки?

Ответы на вопрос — 16

Новый ответ

metin2 pvp metin2 pvp serverler pvp serverler