Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Стили (CSS) » Как задать ширину области для картинок

Как задать ширину области для картинок


     07.07.2012    картинка    Все вопросы » Стили (CSS)    3460

вопрос
Всем доброго времени суток. Появилась необходимость задать ширину области для картинок в короткой новости. Проблема в том, что все 4 картинки выстраиваются в ряд, тогда как необходимо сделать вывод 2х2, не затрагивая при этом текст. Я создал слой, заключил {short-story} в дивы, в CSS задал параметр для этого слоя .story img {???}...а дальше ступор - если задавать отступы, то картинки будут далеко друг от друга.
Подскажите новичку как лучше реализовать? Спасибо

[center]Как есть:
[img] [img] [img] [img]
Текст Текст Текст Текст[/center]

[center]Как хотелось бы:
      [img] [img]
      [img] [img]
Текст Текст Текст Текст[/center]

Ответил: ПафНутиЙ


Ширину области вы никак не зададите, не оборачивая картинки во что-либо, но можно поступить так:
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Картинки</title>
    <style>
    .news {
        text-align: center    
        }
    </style>
</head>

<body>
    <div class="news">
        <img src="" width="400" height="360" alt="" />
        <img src="" width="400" height="360" alt="" />
        <img src="" width="400" height="360" alt="" />
        <img src="" width="400" height="360" alt="" />
    </div>
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
        jQuery(function($) {
            $(".news img:nth-child(2)").after("<div/>");
        });
    </script>
</body>
</html>


При условии что все 4 картинки у вас находятся в начале. Если будет например смайлик перед ними - не сработает.

Как второй вариант - обернуть картинки в див и ограничить ему максимальную ширину.

4 комментария

Sobak
Юзер

Sobak - 8 июля 2012 13:53 -

Тогда вопрос по второму варианту:
Правильно понимаю, что не {short-story} | {full-story} нужно оборачивать в див, тогда что? Картинки при добавлении новости?
Разъясните, пожалуйста поподробнее. Спасибо

Sobak
Юзер

Sobak - 8 июля 2012 15:14 -

О черт, я идиот. Почему бы просто при добавлении новости не сделать так
[center][img1] [img2][/center]
[center][img3] [img4][/center]

ПафНутиЙ
Админ

ПафНутиЙ - 8 июля 2012 15:31 -

Ну это ка бы самый очевидный вариант ))

Каков вопрос - таков и ответ. Просто помните об этом.

Sobak
Юзер

Sobak - 8 июля 2012 15:39 -

ну да, очевиднейший, но я, видно, пересидел за монитором) голова уже ватная была видимо lol
ааа....не перестаю удивляться себе -_-

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх