Масштабирование шаблона

Тема в разделе "CSS, HTML, Web 2.0, верстка по web-стандартам", создана пользователем techn1cian, 21.12.2013.

  1. Offline

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

    Регистрация:
    21.12.2013
    Сообщения:
    3
    Симпатии:
    0
    Пол:
    Мужской
    Все привет, у меня проблема с масштабированием, подскажите пожалуйста куда копать? При изменений размера окно браузера на этом сайте http://am.um.la, содержимое страницы сбивается в кучу. Я нашел файл стиля template.css, в нем блок с контейнерами, попробовал задавать разные позиции у родительских элементов и контейнеров внутри них, но разобраться не получается, моих знаний не хватает.
    Огромное спасибо за всем, кто попробует помочь!
     
  2.  
  3. shurikkan
    Offline

    shurikkan Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 856
    Симпатии:
    162
    Пол:
    Мужской
    Ну, для начала почистите прилипучки (float) после конца строки :)
    И легче всего сделать это так:
    Код (html):
    1. .blog-featured .items-row:after {
    2.     display: block;
    3.     visibility: hidden;
    4.     clear: both;
    5.     content: ".";
    6.     height: 1px;
    7. }

    Псевдоклассы CSS поддерживаются всеми браузерами (CSS2/3) [!]
     
  4. Offline

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

    Регистрация:
    21.12.2013
    Сообщения:
    3
    Симпатии:
    0
    Пол:
    Мужской
    Спасибо большое, что откликнулись, но у меня не получается,в папке со стилями на сервере лежит файл joomla.css, в нем я нашел код:

    Код (html):
    1. section.blog-featured .items-row {
    2.     margin-top: 40px;
    3.     margin-bottom: 0;
    4. }


    После этого куска я вставил то, что написали мне вы, c псевдоклассом after, который как я понимаю после определенного действия заставляет объект отображаться иначе. Нечего не помогло и я подозреваю, что сделал неправильно.
    Вообще там же есть файл стилей template.css, в котором определены следующие контейнеры в теле страницы:

    Код (html):
    1. /* Containers */
    2. div.gk-intro {
    3.     height: 100%;
    4.     position: relative;
    5. }
    6. #gkContent {
    7.     padding: 0 0 30px 0;
    8. }
    9. #gkContentWrapper {
    10.     background: #ffffff;
    11.     position: relative;
    12.     z-index: 50;
    13. }
    14. #gkContentWrapper.noIntro {
    15.     padding: 75px 0 0 0;
    16. }
    17. #gkPageContentWrap {
    18.     background: #ffffff;
    19.     padding: 60px 0 0 0;
    20. }
    21. #gkInset,
    22. #gkSidebar {
    23.     font-size: 14px;
    24. }
    25. .gkPage {
    26.     -webkit-box-sizing: border-box;
    27.     -moz-box-sizing: border-box;
    28.     -ms-box-sizing: border-box;
    29.     -o-box-sizing: border-box;
    30.     box-sizing: border-box;
    31.     margin: 0 auto!important;
    32.     padding: 0;
    33. }
    34. #gkHeader {
    35.     background: #f8f8f8;
    36.     -webkit-box-sizing: border-box;
    37.     -moz-box-sizing: border-box;
    38.     -ms-box-sizing: border-box;
    39.     -o-box-sizing: border-box;
    40.     box-sizing: border-box;
    41.     margin-top: -60px;
    42.     margin-bottom: 30px;
    43. }
    44. .onepage #gkHeader {
    45.     margin-bottom: 0;
    46. }
    47. #gkPageWrap {
    48.     margin: 0 auto;
    49. }
    50. #gkContent,
    51. #gkPageContent,
    52. #gkPageCotnentWrap {
    53.     width: 100%;
    54. }
    55. #gkPageContent {
    56.     margin-bottom: 30px!important;
    57. }
    58. .gridpage #gkPageContent {
    59.     margin-bottom: 14px!important;
    60. }
    61. #gkPageContent + #gkFooter {
    62.     margin-top: 20px;


    Я считал, что нужно плясать вокруг них... Будьте добры, подскажите пожалуйста что не так делаю?
     
  5. shurikkan
    Offline

    shurikkan Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 856
    Симпатии:
    162
    Пол:
    Мужской
    Для того, чтобы понять в каком файле и в какой строке расположены стили, прописанные для элемента на странице, нужно научиться пользоваться инспектором кода.
    Я, например, пользуюсь Firefox Firebug. Правая клавиша мыши на элементе - "Инспектировать элемент с помощью Firebug".
    Ну и учить HTML и CSS, в общем-то...

    Почистил тему... Здесь не место для разборок.
     
    Последнее редактирование: 22.12.2013
  6. Offline

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

    Регистрация:
    21.12.2013
    Сообщения:
    3
    Симпатии:
    0
    Пол:
    Мужской
    Кусок кода, который я показал, я нашел при просмотра кода в браузере. Если бы я не умел делать даже это, то вообще бы не совался.
    Насчет квалификации я сразу сказал, что знаний не хватает (учить css только начинаю), поэтому если не захотели объяснить немного подробней (можно было вообще на словах, как это прописать, я бы разобрался), то промолчите пожалуйста или уж сносите вообще все, а не только не угодную часть топика.
     
  7. shurikkan
    Offline

    shurikkan Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 856
    Симпатии:
    162
    Пол:
    Мужской
    Мне правда жалко, что Вам уделяют так мало внимания. Вы достойны большего!
    И перестаньте писать гадости мне в ЛС.
     

Поделиться этой страницей

Загрузка...