Изменение шаблона rhuk_milkyway под IE8

Тема в разделе "Изменение шаблона (кастомизация)", создана пользователем Pulemet4ik, 08.12.2010.

  1. Offline

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

    Регистрация:
    03.12.2010
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Помогите плиз с решением такого вопроса.Взял стандартный шаблон rhuk_milkyway и переделал его под свои нужды.На задний фон для whitebox поставил .png картинку прописав template.css путь к ней.Firefox i Google chrome показывают этот бэкграунд а IE8 не хочет показывать.Еднственное что установив плагин ie8 compabilitu устранил проблему со съехавшим наверх верхним меню которое должно было лежать на верхней линии whitebox.В хроме пока тоже это меню улетело наверх.Как исправить это в Crome и как заставить IE8 отображать бэкграунд whitebox.

    Тут привожу код template.css подправленного:
    /*****************************/
    /*** Core html setup stuff ***/
    /*****************************/

    html {
    height: 100%;
    margin-bottom: 1px;
    }

    form {
    margin: 0;
    padding: 0;
    }

    body {
    font-family: Helvetica,Arial,sans-serif;
    line-height: 1.3em;
    margin: 0px 0px 0px 0px;
    font-size: 12px;
    color: #333;
    }

    a:link, a:visited {
    text-decoration: none;
    font-weight: normal;
    }

    a:hover {
    text-decoration: underline;
    font-weight: normal;
    }

    input.button { cursor: pointer; }

    p { margin-top: 0; margin-bottom: 5px; }

    img { border: 0 none; }

    /*****************************************/
    /*** Template specific layout elements ***/
    /*****************************************/
    #page_bg {
    padding: 10px 0;
    margin-bottom: 1px;
    }

    div.center {
    text-align: center;
    }

    div#wrapper {
    margin-left: auto;
    margin-right: auto;
    }

    body.width_medium div#wrapper {
    width: 950px;
    }

    body.width_small div#wrapper {
    width: 773px;
    }

    body.width_fmax div#wrapper {
    min-width: 750px;
    max-width: 1050px;
    }

    div#header_l {
    position: relative;
    }

    div#header_r {
    height: 90px;
    padding-left: 370px;
    padding-right: 30px;
    padding-top: 25px;
    overflow: hidden;
    text-align: left;
    }

    div#logo {
    position: absolute;
    left: 0;
    top: 0;
    float: left;
    width: 968px;
    height: 140px;
    background: url(../images/mw_joomla_logo.png) 0 0 no-repeat;
    margin-left: 20px;
    margin-top: 25px;
    }

    div#newsflash {
    width: auto;
    margin-left: 350px;
    margin-right: 30px;
    border: 1px solid #00f;
    }

    div#tabarea {
    background: #f7f7f7;
    margin: 0 11px;

    }

    div#tabarea_l {
    background:none;
    padding-left: 32px;
    }

    div#tabarea_r {
    height: 60px;
    background:none;
    padding-right: 1px;
    }

    div#footer_r {
    padding-top: 10px;
    height: 47px;
    overflow: hidden;
    }

    div#footer_r div {
    text-align: center;
    font-size: .90em;
    color: #aaa;
    }

    div#footer_r a:link, div#footer_r a:visited {
    color: #999;
    }

    div#footerspacer {
    height: 10px;
    }

    #pathway {
    padding: 0px 10px 8px;
    width: auto;
    margin-top: -2px;
    margin-right: 250px;
    text-align: left;
    }

    #search {
    float: right;
    width:320px;
    margin-top: -20px;
    margin-right: 30px;
    height: 40px;
    overflow: hidden;
    text-align:right;
    }

    form#searchForm input {
    vertical-align: middle;
    }

    form#searchForm table {
    border-collapse: collapse;
    }

    form#searchForm td {
    padding:0;
    }

    #mod_search_searchword {
    padding-left: 3px;
    }

    #area {
    padding: 0;
    }

    #whitebox {
    margin: 0 21px 0px 21px;
    background:url(../images/bg-inner.png)no-repeat;
    width: auto;
    }


    #whitebox div {
    text-align: left;

    }

    #whitebox_t {
    background: #fff url(../images/mw_content_t.png) 0 0 repeat-x;
    }

    #whitebox_tl {
    background: url(../images/mw_content_t_l.png) 0 0 no-repeat;
    }

    #whitebox_tr {
    height: 10px;
    overflow: hidden;
    background: url(../images/mw_content_t_r.png) 100% 0 no-repeat;
    }

    #whitebox_m {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    width: auto;
    padding: 1px 8px;
    }

    #whitebox_b {
    margin-top: -5px;
    background: url(../images/mw_content_b.png) 0 100% repeat-x;
    }

    #whitebox_bl {
    background: url(../images/mw_content_b_l.png) 0 100% no-repeat;
    }

    #whitebox_br {
    height: 13px;
    background: url(../images/mw_content_b_r.png) 100% 100% no-repeat;
    }

    /* horizontal pill menu */
    table.pill {
    margin-left: auto;
    margin-right: auto;
    margin-top:55px;
    padding: 0;
    }

    td.pill_l {
    background: url(../images/mw_menu_cap_l.png) no-repeat;
    width: 20px;
    height: 32px;

    }

    td.pill_m {
    background: url(../images/mw_menu_normal_bg.png) repeat-x;
    padding: 0;
    margin: 0;
    width: auto;
    }

    td.pill_r {
    background: url(../images/mw_menu_cap_r.png) no-repeat;
    width: 19px;
    height: 32px;
    }

    #pillmenu {
    white-space: nowrap;
    height: 32px;
    float: left;
    }

    #pillmenu ul {
    margin: 0;
    padding: 0;
    list-style:none;
    }

    #pillmenu li {
    float: left;
    background: url(../images/mw_menu_separator.png) top right no-repeat;
    margin: 0;
    padding: 0;
    }

    #pillmenu a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    float:left;
    display:block;
    height: 24px;
    line-height: 24px;
    padding: 0 20px;
    color: #000;
    text-decoration: none;
    }

    #pillmenu a#active_menu-nav {
    margin-top:2px;
    height: 21px;
    line-height: 21px;
    background-position: 0 0;
    }

    #leftcolumn {
    padding: 0;
    margin: 0;
    width: 20%;
    float:left;
    }

    #maincolumn,
    #maincolumn_full {
    margin-left: 20%;
    padding-left: 15px;
    width: 75%;
    }

    #maincolumn_full {
    margin-left: 0;
    padding: 0;
    width: 100%;
    }

    table.nopad {
    width: 100%;
    border-collapse: collapse;
    padding: 0;
    margin: 0;
    margin-bottom: 15px;
    }

    table.nopad td.middle_pad {
    width: 20px;
    }

    /*****************************************/
    /*** Joomla! specific content elements ***/
    /*****************************************/

    div.offline {
    background: #fffebb;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.2em;
    padding: 5px;
    }

    span.pathway {
    display: block;
    margin: 0 20px;
    height: 16px;
    line-height: 16px;
    overflow: hidden;
    }

    /* headers */
    div.componentheading {
    padding-left: 0px;
    }

    h1 {
    padding: 0;
    font-family:Helvetica ,Arial,sans-serif;
    font-size: 1.3em;
    font-weight: bold;
    vertical-align: bottom;
    color: #666;
    text-align: left;
    width: 100%;
    }

    h2, .contentheading {
    padding: 0;
    font-family: Arial, Helvetica,sans-serif;
    font-size: 1.4em;
    font-weight: normal;
    vertical-align: bottom;
    color: #333;
    text-align: left;
    width: 100%;
    }

    table.contentpaneopen h3 {
    margin-top: 25px;
    }

    h4 {
    font-family: Arial, Helvetica, sans-serif;
    color: #333;
    }

    h3, .componentheading, table.moduletable th, legend {
    margin: 0;
    font-weight: bold;
    font-family: Helvetica,Arial,sans-serif;
    font-size: 1.5em;
    padding-left: 0px;
    margin-bottom: 10px;
    text-align: left;
    }

    /* small text */
    .small {
    font-size: .90em;
    color: #999;
    font-weight: normal;
    text-align: left;
    }

    .modifydate {
    height: 20px;
    vertical-align: bottom;
    font-size: .90em;
    color: #999;
    font-weight: normal;
    text-align: left;
    }

    .createdate {
    height: 20px;
    vertical-align: top;
    font-size: .90em;
    color: #999;
    font-weight: normal;
    vertical-align: top;
    padding-bottom: 5px;
    padding-top: 0px;

    }

    a.readon {
    margin-top: 10px;
    display: block;
    float: left;
    background: url(../images/mw_readon.png) top right no-repeat;
    padding-right: 20px;
    line-height: 14px;
    height: 16px;
    }

    /* form validation */
    .invalid { border-color: #ff0000; }
    label.invalid { color: #ff0000; }


    /** overlib **/

    .ol-foreground {
    background-color: #f6f6f6;
    }

    .ol-background {
    background-color: #666;
    }

    .ol-textfont {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    }

    .ol-captionfont {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #f6f6f6;
    font-weight: bold;
    }
    .ol-captionfont a {
    color: #0B55C4;
    text-decoration: none;
    font-size: 12px;
    }

    .ol-closefont {}

    /* menu links */
    a.mainlevel:link, a.mainlevel:visited {
    padding-left: 5px;
    }

    a.mainlevel:hover {

    }

    /* spacers */
    span.article_separator {
    display: block;
    height: 20px;
    }

    .article_column {
    padding-right: 5px;
    }

    .column_separator {
    border-left: 1px dashed #e0e0e0;
    padding-left: 10px;
    }

    td.buttonheading {

    }

    td.buttonheading img {
    border:none;
    }

    .clr {
    clear: both;
    }

    td.greyline {
    width: 20px;
    background: url(../images/mw_line_grey.png) 50% 0 repeat-y;
    }

    div#maindivider {
    border-top: 1px solid #ddd;
    margin-bottom: 10px;
    overflow: hidden;
    height: 1px;
    }

    table.blog span.article_separator {
    display: block;
    height: 20px;
    }

    /* edit button */
    .contentpaneopen_edit{
    float: left;
    }

    /* table of contents */
    table.contenttoc {
    margin: 5px;
    border: 1px solid #ccc;
    padding: 5px;
    float: right;
    }

    table.contenttoc td {
    padding: 0 5px;
    }


    /* content tables */
    td.sectiontableheader {
    background: #efefef;
    color: #333;
    font-weight: bold;
    padding: 4px;
    border-right: 1px solid #fff;
    }

    tr.sectiontableentry0 td,
    tr.sectiontableentry1 td,
    tr.sectiontableentry2 td {
    padding: 4px;
    }

    td.sectiontableentry0,
    td.sectiontableentry1,
    td.sectiontableentry2 {
    padding: 3px;
    }


    /* content styles */
    table.contentpaneopen, table.contentpane {
    margin: 0;
    padding: 0;
    width: 100%;
    }

    table.contentpaneopen li {
    margin-bottom: 5px;
    }

    table.contentpaneopen fieldset {
    border: 0;
    border-top: 1px solid #ddd;
    }

    table.contentpaneopen h3 {
    margin-top: 25px;
    }

    table.contentpaneopen h4 {
    font-family: Arial, Helvetica, sans-serif;
    color: #333;
    }

    .highlight {
    background-color: #fffebb;
    }

    /* module control elements */
    table.user1user2 div.moduletable {
    margin-bottom: 0px;
    }

    div.moduletable, div.module {
    margin-bottom: 25px;
    }

    div.module_menu h3 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #eee;
    margin: -23px -4px 5px -5px;
    padding-left: 10px;
    padding-bottom: 2px;
    }

    div.module_menu {
    margin: 0;
    padding: 0;
    margin-bottom: 15px;
    }

    div.module_menu div div div {
    padding: 10px;
    padding-top: 30px;
    padding-bottom: 15px;
    width: auto;
    }

    div.module_menu div div div div {
    background: none;
    padding: 0;
    }

    div.module_menu ul {
    margin: 10px 0;
    padding-left: 20px;
    }

    div.module_menu ul li a:link, div.module_menu ul li a:visited {
    font-weight: bold;
    }

    #leftcolumn div.module {
    padding: 0 10px;
    }

    #leftcolumn div.module table {
    width: auto;
    }

    /* forms */
    table.adminform textarea {
    width: 540px;
    height: 400px;
    font-size: 1em;
    color: #000099;
    }

    div.search input {
    width: 145px;
    border: 1px solid #ccc;
    margin: 15px 0 10px 0;
    }

    form#form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
    form#form-login ul { padding-left: 20px; }

    form#com-form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
    form#com-form-login ul { padding-left: 20px; }

    /* thumbnails */
    div.mosimage { margin: 5px; }
    div.mosimage_caption { font-size: .90em; color: #666; }

    div.caption { padding: 0 10px 0 10px; }
    div.caption img { border: 1px solid #CCC; }
    div.caption p { font-size: .90em; color: #666; text-align: center; }

    div.img_caption { padding: 0 10px 0 10px; }
    div.img_caption img { border: 1px solid #CCC; }
    div.img_caption p { font-size: .90em; color: #666; text-align: center; }

    /* Parameter Table */
    table.paramlist {
    margin-top: 5px;
    }

    table.paramlist td.paramlist_key {
    width: 128px;
    text-align: left;
    height: 30px;
    }

    table.paramlist td.paramlist_value {
    }

    div.message {
    font-family : "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size : 14px;
    color : #c30;
    text-align: center;
    width: auto;
    background-color: #f9f9f9;
    border: solid 1px #d5d5d5;
    margin: 3px 0px 10px;
    padding: 3px 20px;
    }

    /* Banners module */

    /* Default skyscraper style */
    .bannergroup {
    }

    .banneritem img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

    /* Text advert style */

    .banneritem_text {
    padding: 4px;
    font-size: 11px;
    }

    .bannerfooter_text {
    padding: 4px;
    font-size: 11px;
    background-color: #F7F7F7;
    text-align: right;
    }

    /* System Messages */
    /* see system general.css */

    .pagination span { padding: 2px; }
    .pagination a { padding: 2px; }

    /* Polls */
    .pollstableborder td {
    text-align: left;
    }

    /* WebLinks */
    span.description {
    display:block;
    padding-left: 30px;
    }

    /* Frontend Editing*/
    fieldset {
    border: 1px solid #ccc;
    margin-top: 15px;
    padding: 15px;
    }

    legend {
    margin: 0;
    padding: 0 10px;
    }

    td.key {
    border-bottom:1px solid #eee;
    color: #666;
    }

    /* Tooltips */

    .tool-tip {
    float: left;
    background: #ffc;
    border: 1px solid #D4D5AA;
    padding: 5px;
    max-width: 200px;
    }

    .tool-title {
    padding: 0;
    margin: 0;
    font-size: 100%;
    font-weight: bold;
    margin-top: -15px;
    padding-top: 15px;
    padding-bottom: 5px;
    background: url(../../system/images/selector-arrow.png) no-repeat;
    }

    .tool-text {
    font-size: 100%;
    margin: 0;
    }

    /* System Standard Messages */
    #system-message { margin-bottom: 20px; }

    #system-message dd.message ul { background: #C3D2E5 url(../../system/images/notice-info.png) 4px center no-repeat;border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

    /* System Error Messages */
    #system-message dd.error ul { color: #c00; background: #E6C0C0 url(../../system/images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

    /* System Notice Messages */
    #system-message dd.notice ul { color: #c00; background: #EFE7B8 url(../../system/images/notice-note.png) 4px center no-repeat; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E; margin:0px; padding-left: 40px; text-indent:0px;}

    #syndicate{
    float:left;
    padding-left: 25px;
    }

    #power_by{
    float:right;
    padding-right: 25px;
    }

    /* Component Specific Fixes */

    #component-contact table td {
    padding: 2px 0;
    }

    Помогите плиз новичку!Место где прописал путь выделил красным
    заранее благодарю.
     
  2.  
  3. Offline

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

    Регистрация:
    03.12.2010
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Еще забыл добавить что делаю на локалке denwer эти преобразования.
     
  4. Vamp
    Offline

    Vamp Модератор

    Регистрация:
    30.06.2010
    Сообщения:
    282
    Симпатии:
    44
    Пол:
    Мужской
    А у меня меню село на место в хроме и опере . По началу тоже вверу было, потом село на место. Как не пойму. Сначала скопировал весь твой код из темы и вставил в template.css. Меню улетело.
    Потом скопировал только строку background:url(../images/bg-inner.png)no-repeat; , вставил только ее и меню на место село! Не пойму в чем дело . Вот как хром отображает (поставил серый фон)
    2010-12-09_021415.jpg
    В ИЕ так фон и не отобразился
     
  5. Offline

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

    Регистрация:
    03.12.2010
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Я поставил плагин ie8 compability и в ie8 у меня село на место а в хроме так и висит как у тебя на скрине.Я думаю,это легче исправить чем то,что ie8 не показывает тот самый бэкграунд в whitebox,путь к которому я прописал в template.css шаблона.Тем не менее лого в том же формате .png отображается нормально.
    Прилогаю скрины с видами в разных браузерах сейчас:

    Код (CODE):
    1. [url=http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/oFirefox.png.htm][img]http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/tFirefox.png[/img]
    в FIrefoxe

    Код (CODE):
    1. [url=http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/oInternetEXP8.png.htm][img]http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/tInternetEXP8.png[/img]
    это в Эксплорере

    Код (CODE):
    1. [url=http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/oChrome.png.htm][img]http://s2.itrash.ru/idb/9cb84925e22db355749580a58fc94224/tChrome.png[/img]
    это в Хроме

    Причем с хромом еще не совмещал.
    Помогите плиз сделать чтбы везде как в FIrefox выглядело.Странно почему логотип в .png отображается везде нормально.
     
    Последнее редактирование: 09.12.2010

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

Загрузка...