Возможно ли сделать сайт "резиновым"?

Discussion in 'Изменение шаблона (кастомизация)' started by GoodsTours, Jan 15, 2015.

  1. GoodsTours
    Offline

    GoodsTours Недавно здесь

    Joined:
    Jan 15, 2015
    Messages:
    3
    Likes Received:
    0
    Gender:
    Female
    Здравствуйте! Пожалуйста, не ругайтесь на меня... Я новичок, но пытаюсь сделать свой сайт своими руками... И вроде получается. Только вот столкнулась с проблемой - и ни поиск в интернете, ни "метод тыка" не помогают...
    Итак, дело вот в чем.
    Есть сайт: www.хорошие-туры.рф
    Раньше вся содержательная часть находилась по центру, а по краям - пустые поля. Решила я эти поля убрать. Растянула шапку на 100%, левые и правые модули растащила по краям. А вот с центральной частью, там, где текст, ничего не получается. Вот часть кода шаблона сайта, которая, как я понимаю, за это дело отвечает:

    $rightColWidth="300";
    if($showRightColumn == false){$rightColWidth="0";}

    $leftColWidth="300";
    if($showLeftColumn == false){$leftColWidth="0";}

    $wrapperWidth=940-($rightColWidth+$leftColWidth);

    В идеале бы сделать

    $rightColWidth="25%";
    if($showRightColumn == false){$rightColWidth="0";}

    $leftColWidth="25%";
    if($showLeftColumn == false){$leftColWidth="0";}

    $wrapperWidth="50%";

    Но когда так делаю, то все три столбика становятся не рядом, а друг под другом. Левый, центральный, и правый - один под другим.

    Если оставляю исходный код, то получается ерунда (см.приложенный файл)

    Помогите, пожалуйста!
    hostingkartinok_com_7023926364521678097.png hostingkartinok_com_8382996676275317346.png

     
    GoodsTours, Jan 15, 2015
    #1

  2. Ads Master

     
    3. Best Answer:
    Post #3 by shure348, Jan 16, 2015
  3. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    А если колонкам дать по 22%, а центру 47%
    и применяй box-sizing CSS
     
    OlegK, Jan 16, 2015
    #2
  4. shure348
    Offline

    shure348 Активист

    Joined:
    Aug 21, 2012
    Messages:
    145
    Likes Received:
    27
    Gender:
    Male
    Best Answer
    можно как вариант к .wrapper добавить сврйство width: calc(100% - 600px) !important; потому что боковины по 300px стоят
    но при совсем узком экране все равно надо доделывать
     
    shure348, Jan 16, 2015
    #3
    GoodsTours likes this.
  5. GoodsTours
    Offline

    GoodsTours Недавно здесь

    Joined:
    Jan 15, 2015
    Messages:
    3
    Likes Received:
    0
    Gender:
    Female
    А где искать ".wrapper"?
    --- добавлено: Jan 16, 2015, первое сообщение размещено: Jan 16, 2015 ---
    Вставила

    $rightColWidth="22%";
    if($showRightColumn == false){$rightColWidth="0";}

    $leftColWidth="22%";
    if($showLeftColumn == false){$leftColWidth="0";}

    $wrapperWidth="47%";
    ________________

    И просто

    $rightColWidth="22%";

    $leftColWidth="22%";

    $wrapperWidth="47%";

    Результат один: снова все смещается одно под другое (см.картинки). В общем, не хочет % принимать...
    hostingkartinok_com_2837954153236022762.png hostingkartinok_com_8751260034043495204.png
     
    GoodsTours, Jan 16, 2015
    #4
  6. shure348
    Offline

    shure348 Активист

    Joined:
    Aug 21, 2012
    Messages:
    145
    Likes Received:
    27
    Gender:
    Male
    .wrapper искать в position.css строка 75:)
     
    shure348, Jan 16, 2015
    #5
    GoodsTours likes this.
  7. GoodsTours
    Offline

    GoodsTours Недавно здесь

    Joined:
    Jan 15, 2015
    Messages:
    3
    Likes Received:
    0
    Gender:
    Female
    Спасибо огромное!!! Все получилось :))) А сделать совсем "резиновый", чтобы в пропорциях колонки были (25-50-25, к примеру) нельзя?
     
    GoodsTours, Jan 17, 2015
    #6
  8. AKopytenko
    Offline

    AKopytenko Russian Joomla! Team Staff Member

    Joined:
    Sep 1, 2011
    Messages:
    1,963
    Likes Received:
    168
    Gender:
    Male
    Круто, конечно, но:
    http://htmlbook.ru/css/calc

    Это работает только в новых браузерах. А в браузерах Android или iOS не работает вообще.
     
    AKopytenko, Jan 18, 2015
    #7
  9. shure348
    Offline

    shure348 Активист

    Joined:
    Aug 21, 2012
    Messages:
    145
    Likes Received:
    27
    Gender:
    Male
    для мобил тогда уже вcтупает в бой @media :)
     
    shure348, Jan 19, 2015
    #8
< Как "растянуть" высоту блоков модулей? | Как сделть шаблон yt subway резиновым? >

Share This Page

Loading...