проблема с версткой

Discussion in 'CSS, HTML, Web 2.0, верстка по web-стандартам' started by moris_9, May 14, 2012.

  1. Offline

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

    Joined:
    Mar 7, 2012
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Добрый день. У меня проблема с версткой.
    Заказывал верстку, сделали, принял и оплатил. Через некоторое время заметил что в разных браузерах. Колонка меня отображается по разному. В Мазиле заметил что у правой колонки углы закругленные, сглаженные а в Опере прямоугольные. Вот сайт pozdravim.net
    Если кто знает как это исправить посоветуйте.
     
    moris_9, May 14, 2012
    #1

  2. Ads Master

     
  3. Oozii
    Offline

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

    Joined:
    May 12, 2012
    Messages:
    58
    Likes Received:
    2
    Gender:
    Male
    Просто каждый браузер понимает таблицы стилей по разному. Видимо программисты не учли некоторые фрагметы кода и не прописали совместимость с той же оперой. Проще говоря заточили под огнелиса).

    Если твой код не является военной тайной, то могу глянуть сегодня вечером после работы, если что кидай в личку.

    --

    Позволь поинтересоваться - сколько денег отдал за это?
     
    Last edited: May 14, 2012
    Oozii, May 14, 2012
    #2
  4. Offline

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

    Joined:
    Mar 13, 2010
    Messages:
    452
    Likes Received:
    18
    Gender:
    Female
    В файле styles.css найдите блок: .module { .... }
    Здесь у вас прописываются стили модулей, здесь пропишие скругление для оперы.
     
    Airis, May 14, 2012
    #3
  5. Offline

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

    Joined:
    Mar 7, 2012
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Не много 40-50 баксов)

    }
    Код (html):
    1. .module{
    2.  
    3.     width: 206px;
    4.     padding-bottom: 0px;
    5.    margin-bottom: 10px;
    6.    margin-left: 4px;
    7.    padding-left: 0px
    8.    font-size: 15px;
    9.    border: 1px solid #ccc;
    10.    border-top: 0px;
    11.    -webkit-border-radius: 10px;
    12.    -moz-border-radius: 10px;
    13.    border-radius: 10px;
    14.    behavior: url(../pie/PIE.php);
    15.   /* background:  url('../images/podmod.png') no-repeat ;*/
    16. }


    Вот код модуля, не понимаю что прописать нужно?!
     
    moris_9, May 15, 2012
    #4
  6. Offline

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

    Joined:
    Dec 19, 2008
    Messages:
    54
    Likes Received:
    8
    Gender:
    Male
    border-top: 0px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
     
    teleman, May 15, 2012
    #5
  7. Oozii
    Offline

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

    Joined:
    May 12, 2012
    Messages:
    58
    Likes Received:
    2
    Gender:
    Male
    я бы еще добавил такую строчку:

    -khtml-border-radius: 10px; // Konqueror
     
    Oozii, May 15, 2012
    #6
  8. Offline

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

    Joined:
    Mar 7, 2012
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Попробовал вставить и так и так. Не выходит :(
     
    moris_9, May 16, 2012
    #7
  9. Offline

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

    Joined:
    Dec 19, 2008
    Messages:
    54
    Likes Received:
    8
    Gender:
    Male
    модули в левой колонке показывает нормально, а в правой используется другой класс - curved

    добавь туда тоже
    -o-border-radius: 10px;
    и все должно заработать
     
    teleman, May 16, 2012
    #8
  10. Offline

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

    Joined:
    Mar 7, 2012
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Код (html):
    1. .curved {
    2.    float: right;
    3.     width: 206px;
    4.     padding-bottom: 0px;
    5.    margin-bottom: 10px;
    6.    margin-right: 4px;
    7.    padding-left: 0px
    8.    font-size: 15px;
    9.    border: 1px solid #ccc;
    10.    border-top: 0px;
    11. [COLOR="Red"]-o-border-radius: 10px;[/COLOR]
    12. -moz-border-radius:10px;
    13. -webkit-border-radius:10px;
    14. behavior: url(../curved/border-radius.htc);
    15. }


    Вставил правильно? Все равно не получается
     
    moris_9, May 16, 2012
    #9
  11. Offline

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

    Joined:
    Dec 19, 2008
    Messages:
    54
    Likes Received:
    8
    Gender:
    Male
    попробуй вот так:

    .curved {
    float: right;
    width: 206px;
    padding-bottom: 0px;
    margin-bottom: 10px;
    margin-right: 4px;
    padding-left: 0px
    font-size: 15px;
    border: 1px solid #ccc;
    border-top: 0px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    }
     
    teleman, May 16, 2012
    #10
    moris_9 likes this.
  12. Oozii
    Offline

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

    Joined:
    May 12, 2012
    Messages:
    58
    Likes Received:
    2
    Gender:
    Male
    Юморист =)
     
    Oozii, May 16, 2012
    #11
  13. Offline

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

    Joined:
    Mar 7, 2012
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Спасибо большое )) Все получилось! ))
     
    moris_9, May 17, 2012
    #12
  14. Offline

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

    Joined:
    Dec 19, 2008
    Messages:
    54
    Likes Received:
    8
    Gender:
    Male
    Под некоторыми броузерами, типа ie8, эта конструкция всё равно будет работать некорректно. Я бы картинку-подложку перенес из свойств тега h3 в curved и module, чтобы в случае, когда закруглить углы невозможно отрисовывался нормальный прямоугольник.
     
    teleman, May 17, 2012
    #13
< Левый столбец залазит на фоновую картинку | Выпадающее меню, пункты переносятся по строкам >

Share This Page

Loading...