За последние 24 часа нас посетили 17260 программистов и 1597 роботов. Сейчас ищут 1775 программистов ...

Снова две колонки, но посложнее...

Тема в разделе "HTML и CSS", создана пользователем Master of Code, 1 мар 2007.

  1. Master of Code

    Master of Code Активный пользователь

    С нами с:
    1 мар 2007
    Сообщения:
    3
    Симпатии:
    0
    Есть задача - размещать генерируемые элементы в 2 колонки. Поясню, есть интернет-магазин, он выводит список товаров, каждая позиция это контейнер DIV (можно любой другой, назначается в шаблоне). Можно ли средствами css сделать так, чтобы на строке появлялось 2 элемента.
    Сейчас:

    []
    []
    []
    []

    Нужно:
    [] []
    [] []


    Попытки сделать на каждый новый элемент ширину 50%, а так же замена DIV на SPAN не увенчалась успехом. Помогите, если конечно такое решение есть.
    И еще, просьба, не советуйте поменять движок магазина или дописывать код.

    спасибо
     
  2. Demon

    Demon Активный пользователь

    С нами с:
    20 апр 2006
    Сообщения:
    239
    Симпатии:
    0
    Код (Text):
    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    2.  
    3. <html>
    4. <head>
    5. <title>Untitled</title>
    6. <style type="text/css">
    7. <!--
    8. body {
    9. margin: 0;
    10. padding: 0;
    11. }
    12. div {
    13. background-color: silver;
    14. margin-top: 1px;
    15. width: 49.9%;
    16. float: left;
    17. }
    18. -->
    19. </style>
    20.  
    21. </head>
    22. <body>
    23. <div>Text 1</div>
    24. <div>Text 2</div>
    25. <div>Text 3</div>
    26. <div>Text 4</div>
    27. </body>
    28. </html>
     
  3. Master of Code

    Master of Code Активный пользователь

    С нами с:
    1 мар 2007
    Сообщения:
    3
    Симпатии:
    0
    ООО
    пасиба большое)))
    буду тестировать в своих условиях))
     
  4. dark-demon

    dark-demon Активный пользователь

    С нами с:
    16 фев 2007
    Сообщения:
    1.920
    Симпатии:
    1
    Адрес:
    леноград
    советую флоаты обернуть в див для которого задать
    Код (Text):
    1. overflow:hidden; width:100%
    , чтобы флоаты не глотали идущие следом блоки.
     
  5. Master of Code

    Master of Code Активный пользователь

    С нами с:
    1 мар 2007
    Сообщения:
    3
    Симпатии:
    0
    Большое спасибо за советы, все получилось и работает))