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

Тема в разделе "Верстка", создана пользователем winsofts, 12 июл 2012.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. winsofts

    winsofts Постоялец

    Регистр.:
    25 июл 2009
    Сообщения:
    83
    Симпатии:
    0
    как сверстать такое? интересно как все объеденить в одном диве, что бы потом менять только начинку. не могу докумекать с моими знаниями_) тут 3 новости одинаково сделанных, вот как сделать одну что бы в диве была и дата, и фото и описание?
    [​IMG]
    начертил схему, правильно понимаю я? и все должно быть relative?
    [​IMG]
     
  2. kadurinho

    kadurinho Shop Script

    Moderator
    Регистр.:
    21 июн 2011
    Сообщения:
    626
    Симпатии:
    257
    anadikt нравится это.
  3. aaidlin

    aaidlin Создатель

    Регистр.:
    30 авг 2012
    Сообщения:
    20
    Симпатии:
    3
    Каждый блок (дата+картинка+описание) можно поместить в <li>, а вся конструкция будет в <ul>.
    Тогда, дату помещаем в <div>, затем выводим картнку <img> и описание тоже кладем в <div>.

    Для <li> надо указать float:left, чтобы они шли слева направо. Должно работать.
     
  4. B2ron

    B2ron Постоялец

    Регистр.:
    7 сен 2012
    Сообщения:
    82
    Симпатии:
    20
    я бы сделал div со свойствами display: inline-block и float:left
    к тому же строку "Полезно быть в курсе" надо заключить в тег заголовка H3 или H4.
     
  5. Dezm

    Dezm Создатель

    Регистр.:
    27 апр 2010
    Сообщения:
    41
    Симпатии:
    2
    Подскажите, если использовать display: inline-block для <ul> будет ли список идти строкой или можно использовать только display: inline-block и float:left?
     
  6. WerewolfGSM

    WerewolfGSM

    Регистр.:
    4 дек 2006
    Сообщения:
    257
    Симпатии:
    11
    display: inline-block и float:left делать для <li>