Новости Joomla

0 Пользователей и 1 Гость просматривают эту тему.
  • 5 Ответов
  • 3948 Просмотров
*

Sergvideo

  • Осваиваюсь на форуме
  • 41
  • 3 / 0
Простите если тема уже подымалась, но в поиске не нашел  :(

Кратко суть проблемы:

неправильно отображается menubar-m. В мозиле и опере все норм. Перерыл форум, но не нашол как поправить, понимаю, что нужно прописать условие для ИЕ, прописую, но не работает... Наверное руки кривые? Может кто поможет?

Есть отдельные CSS под IE:

iehacks.css
Код: css
/* clearing & floating */

/* http://www.positioniseverything.net/easyclearing.html */

/* http://www.456bereastreet.com/archive/200603/new_clearing_method_needed_for_ie7/#comment28 */

.clearfix { display: inline-block } 

.clearfix { display: block }         

* HTML .clearfix { height: 1% }     



 

* HTML .floatbox { width:100% }



 

.ie_fix_floats {

width: 100%;

padding: 0 1px 0 1px;   

margin: 0 -1px 0 -1px; 

overflow: hidden;

}



 

html { height: auto; margin-bottom:0; }



 

body { position:relative }           

* HTML body { position:static }     

#middle { position: relative }       



 

/* Peekaboo Bug  */

/* http://www.positioniseverything.net/explorer/peekaboo.html */

/* * HTML #left { position:relative } */ 

/* * HTML #right { position:relative } */ 

/* * HTML #main { position:relative } */



 

/* Escaping Floats Bug, force hasLayout */

/* http://www.positioniseverything.net/explorer/escape-floats.html */

body { height: 1% }

div.wrapper, #header, #top, #middle, #bottom { zoom:1 }         

div.wrapper { height: 1% }                                       



 

/* Doubled Float Margins */

/* http://www.positioniseverything.net/explorer/doubled-margin.html */

* HTML #left { display: inline }

* HTML #right { display: inline }



* HTML .float-left { display:inline; }

* HTML .float-right { display:inline; }



 

/* Italics bugs in IE 5.x and IE 6 */

/* http://www.positioniseverything.net/explorer/italicbug-ie.html */

* HTML #left_container { overflow: visible; }

* HTML #right_container { overflow: visible; }

* HTML #main_container { overflow: visible; }

* HTML i, * HTML em { overflow: visible; display:inline-block; }



 

/* Expanding Box Problem */

/* http://www.positioniseverything.net/explorer/expandingboxbug.html */

* HTML #left_container { word-wrap: break-word; }

* HTML #right_container { word-wrap: break-word; }

* HTML #main_container { word-wrap: break-word; }



 

 

 






 

/* Italics bugs in IE 5.x and IE 6 */

/* http://www.positioniseverything.net/explorer/italicbug-ie.html */

* HTML textarea { overflow:scroll; overflow-x: hidden; }

* HTML input { overflow: hidden; }



 

/* IE/Win Guillotine Bug */

/* http://www.positioniseverything.net/explorer/guillotine.html */

/* http://www.thestyleworks.de/tut-art/ie7.shtml */

* HTML body a, * HTML body a:hover { background-color: transparent; }



 

/* List-Numbering Bug */

body ol li { display:list-item; }

ie6hacks.css

Код: css
/* reset */
hr {
color: #c8c8c8;
}

/*
 * layout
 */

div#menubar { margin-top:130px; width: auto;  margin: 0px 0px 0px 0px; padding: 0px 25px 0px 25px; clear: both;  position: relative;}div#menubar div.menubar-m { margin-top:130px; height: 55px; background: url(../images/menubar_m.png) 0 0 repeat-x; /* ie6png:scale */}div#menubar div.menubar-l { position: absolute; top: 0px; left: 0px; width: 25px; height: 55px; background: url(../images/menubar_l.png) 0 0 no-repeat; /* ie6png:scale */}div#menubar div.menubar-r { position: absolute; top: 0px; right: 0px; width: 25px; height: 55px; background: url(../images/menubar_r.png) 0 0 no-repeat; /* ie6png:scale */}

div#banner {
right: -135px;
width: 120px;
}

div#middle .background {

height: 200px; 
}

div#main div.main-container-t {
zoom: 1; 
}

div#main div.main-t {
overflow: hidden;
}

div#main div.main-tl {
overflow: hidden;
}

div#main div.main-tr {
overflow: hidden;
}

div#main div.main-m {
zoom: 1;
}

div#main div.main-container-b {
zoom: 1; 
}

div#main div.main-b {
overflow: hidden;
}

div#main div.main-bl {
overflow: hidden;
}

div#main div.main-br {
overflow: hidden;
}

div#footer {
height: 50px; 
zoom: 1; 
}

/*
 * menus
 */

div#menu li.fancy {
width: 0px;
}

div#menu li.fancy div.fancy-container div.fancy-r {
right: -1px;
width: 51px;
height: 35px;
background: url(../images/menu_fancy_r.png) 0 0 repeat-x;
}

div#menu ul.menu ul {
background: url(../images/menu_dropdown_bg_ie6.png) 0 100% no-repeat;
}

/*
 * modules
 */

div.module {
zoom: 1; 
}

 
#toolbar div.module {
width: 0px;
}

#headerbar div.module {
width: 0px;
}

#toolbar div.mod-blank div.module,
#headerbar div.mod-blank div.module {
overflow: visible;
}

/* roundedtrans */
div.mod-roundedtrans div.module,
div.mod-roundedtrans div.box-container-t,
div.mod-roundedtrans div.box-l,
div.mod-roundedtrans div.box-container-b  {
zoom: 1; 
}

div.mod-roundedtrans div.box-t,
div.mod-roundedtrans div.box-tl,
div.mod-roundedtrans div.box-tr,
div.mod-roundedtrans div.box-b,
div.mod-roundedtrans div.box-bl,
div.mod-roundedtrans div.box-br  {
overflow: hidden; 
}

div.mod-roundedtrans div.box-l {
padding: 0px 10px 0px 10px;
position: relative;
overflow: hidden; 
background: none;
}

div.mod-roundedtrans div.box-r {
padding: 0px;
background: none;
}

div.mod-roundedtrans div.box-l-ie6 {
display: block;
position: absolute;
top: 0px;
left: 0px;
width: 10px;
height: 99999px;
background: url(../images/module_roundedtrans_l.png) 0 0 repeat-y; /* ie6png:scale */
}

div.mod-roundedtrans div.box-r-ie6 {
display: block;
position: absolute;
top: 0px;
right: 0px;
width: 10px;
height: 99999px;
background: url(../images/module_roundedtrans_r.png) 0 0 repeat-y; /* ie6png:scale */
}

div.mod-roundedtrans div.box-m {
padding: 0px 5px 0px 5px;
background: url(../images/module_roundedtrans_bg.png) 0 0 repeat; /* ie6png:scale */
overflow: hidden; 
zoom: 1; 
}

div.mod-roundedtrans div.module div.ie6 {
position: relative; 
}

/* roundedtrans-header */
div.mod-roundedtrans-header div.module,
div.mod-roundedtrans-header div.box-l {
zoom: 1; 
}

div.mod-roundedtrans-header div.box-l {
padding: 0px 10px 0px 10px;
position: relative;
overflow: hidden; 
background: none;
}

div.mod-roundedtrans-header div.box-r {
padding: 0px;
background: none;
}

div.mod-roundedtrans-header div.box-l-ie6 {
display: block;
position: absolute;
top: 0px;
left: 0px;
width: 10px;
height: 99999px;
background: url(../images/module_headerposition_l.png) 0 0 no-repeat; /* ie6png:crop */
}

div.mod-roundedtrans-header div.box-r-ie6 {
display: block;
position: absolute;
top: 0px;
right: 0px;
width: 10px;
height: 99999px;
background: url(../images/module_headerposition_r.png) 100% 0 no-repeat; /* ie6png:crop */
}

div.mod-roundedtrans-header div.box-m {
background: url(../images/module_headerposition_m.png) 0 0 repeat-x; /* ie6png:scale */
overflow: hidden; 
zoom: 1; 
}

div.mod-roundedtrans-header div.module div.ie6 {
position: relative; 
}

/* rounded */
div.mod-rounded div.module,
div.mod-rounded div.box-container-t,
div.mod-rounded div.box-1,
div.mod-rounded div.box-container-b  {
zoom: 1; 
}

div.mod-rounded div.box-t,
div.mod-rounded div.box-tl,
div.mod-rounded div.box-tr,
div.mod-rounded div.box-b,
div.mod-rounded div.box-bl,
div.mod-rounded div.box-br  {
overflow: hidden; 
}

/* black */
div.mod-black div.module,
div.mod-black div.box-container-t,
div.mod-black div.box-1,
div.mod-black div.box-container-b  {
zoom: 1; 
}

div.mod-black div.box-t,
div.mod-black div.box-tl,
div.mod-black div.box-tr,
div.mod-black div.box-b,
div.mod-black div.box-bl,
div.mod-black div.box-br  {
overflow: hidden; 
}

/* border */
div.mod-border div.module,
div.mod-border div.box-container-t,
div.mod-border div.box-1,
div.mod-border div.box-container-b  {
zoom: 1; 
}

div.mod-border div.box-t,
div.mod-border div.box-tl,
div.mod-border div.box-tr,
div.mod-border div.box-b,
div.mod-border div.box-bl,
div.mod-border div.box-br  {
overflow: hidden; 
}

/* dotted */
div.mod-dotted h3.header {
zoom: 1; 
}

/* polaroid */
div.mod-polaroid div.module,
div.mod-polaroid div.box-2,
div.mod-polaroid div.box-container-b {
zoom: 1; 
}

div.mod-polaroid div.badge-tape {
top: 0px;
}

div.mod-polaroid div.box-b,
div.mod-polaroid div.box-bl,
div.mod-polaroid div.box-br {
overflow: hidden;
}

div.mod-polaroid div.badge-new { top: 13px; }
div.mod-polaroid div.badge-top { top: 13px; }
div.mod-polaroid div.badge-pick { top: 13px; }

/* postit */
div.mod-postit div.module,
div.mod-postit div.box-2,
div.mod-postit div.box-container-b {
zoom: 1; 
}

div.mod-postit div.box-b,
div.mod-postit div.box-bl,
div.mod-postit div.box-br {
overflow: hidden;
}

/* tab */
div.mod-tab div.box-2,
div.mod-tab div.box-3,
div.mod-tab div.box-4 {
zoom: 1;
}

div.mod-tab div.header-container {
width: 0px;
display: inline; 
white-space: nowrap;
}

div.mod-tab h3.header,
div.mod-tab div.header-l,
div.mod-tab div.header-r {
overflow: hidden;
}

/*
 * joomla
 */

div.joomla div.headline {
zoom: 1;
}

div.joomla div.item,
div.joomla div.item-bg {
zoom: 1;
}

div.module-search input {
width: 88px;
}

a.readmore {
cursor: pointer;
}

/*
 * typography
 */

ul.arrow li,
ul.checkbox li,
ul.check li,
ul.star li {
zoom: 1;
}

ol.disc {
padding: 0px 0px 0px 50px;
background: url(../images/typography/list_disc_ie6.png) 20px 0px repeat-y;
}

ol.disc li {
padding-left: 5px;
}

blockquote.quotation {
background: url(../images/typography/blockquote_start_ie6.png) 0 0 no-repeat;
}

blockquote.quotation p {
background: url(../images/typography/blockquote_end_ie6.png) 100% 100% no-repeat;
}

hr.dotted {
background: none;
border: dotted 1px #c8c8c8;
}

p.dropcap:first-letter {
line-height: 100%;
}

/*
 * extensions
 */

.ie6-zoom {
zoom: 1;
}

ie7hacks.css

Код: css
/* Joomla */
div#yoo-search input {
width: 91px;
}
div#menubar { margin-top:130px; width: auto;  margin: 0px 0px 0px 0px; padding: 0px 25px 0px 25px; clear: both;  position: relative;}div#menubar div.menubar-m { margin-top:130px; height: 55px; background: url(../images/menubar_m.png) 0 0 repeat-x; /* ie6png:scale */}div#menubar div.menubar-l { position: absolute; top: 0px; left: 0px; width: 25px; height: 55px; background: url(../images/menubar_l.png) 0 0 no-repeat; /* ie6png:scale */}div#menubar div.menubar-r { position: absolute; top: 0px; right: 0px; width: 25px; height: 55px; background: url(../images/menubar_r.png) 0 0 no-repeat; /* ie6png:scale */}
/* general */
ol.disc {
padding: 0px 0px 0px 50px;
}

ol.disc li {
padding-left: 5px;
}

hr.dotted {
background: none;
border: dotted 1px #c8c8c8;
}

p.dropcap:first-letter {
line-height: 110%;
}

Вот основной CSS  по моей проблеме.

layout.css


Код: css

/*

 * Page

 */

 

body {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

line-height: 150%;

color: #333333;

}



body.yoopage {

background: #C8CDD2 url(../images/page_bg.png) 50% 0 repeat-x;

}



/* center page */

div.wrapper {

margin: auto;

}



/*

 * Layout

 */



div#absolute {

position: absolute;

z-index: 15;

top: 0px;

left: 0px;

width: 100%;

}



div#page-body {

background: url(../images/page_bg_img.jpg) 50% 0 no-repeat;

}



div#header {

width: auto; 

height: 290px;

padding: 0px 0px 0px 0px;

position: relative;

z-index: 10;

clear: both; 

}



div#toolbar {

width: auto; 

height: 25px;

padding: 0px 5px 0px 5px;

clear: both; 

overflow: hidden;

font-size: 85%;

line-height: 250%;

}



div#date {

margin: 0px 10px 0px 0px;

float: left;

}



div#topmenu {

margin: 0px 10px 0px 0px;

float: left;

}



div#headerbar {

width: auto; 

height: 80px;

padding: 0px 5px 0px 5px;

clear: both; 

overflow: hidden;

}



div#menubar {

margin-top:130px;

width: auto; 

margin: 0px 0px 0px 0px;

padding: 0px 25px 0px 25px;

clear: both; 

position: relative;

}



div#menubar div.menubar-m {

margin-top:130px;

height: 55px;

background: url(../images/menubar_m.png) 0 0 repeat-x; /* ie6png:scale */

}



div#menubar div.menubar-l {

position: absolute;

top: 0px;

left: 0px;

width: 25px;

height: 55px;

background: url(../images/menubar_l.png) 0 0 no-repeat; /* ie6png:scale */

}



div#menubar div.menubar-r {

position: absolute;

top: 0px;

right: 0px;

width: 25px;

height: 55px;

background: url(../images/menubar_r.png) 0 0 no-repeat; /* ie6png:scale */

}



div#menu {

margin-top:130px;

position: absolute;

top: 114px;

left: 12px;

z-index: 11;

height: 35px;

}



div#logo {

position: absolute;

top: 20px;

left: 0px;

}



div#search {

margin-top:130px;

position: absolute;

top: 115px;

right: 12px;

z-index: 12;

width: 134px; 

height: 26px;

padding: 7px 0px 0px 26px;

background: url(../images/searchbox_bg.png) 0 0 no-repeat;

}



div#banner {

position: absolute;

top: 15px;

right: -15px;

width: 0px;

z-index: 3;

}



div#top {

width: auto; 

margin: 0px 0px 0px 0px;

padding: 0px 5px 0px 5px;

clear: both; 

}



div#top .topbox {

margin-top: 15px;

}



div#middle {

width: auto; 

margin: 0px 0px 0px 0px;

padding: 15px 5px 15px 5px;

clear: both; 

}



div#middle .background {

min-height: 200px;









}



 

div#middle .background {

background: none;

}



 

.left div#middle .background {

background: none;

}



 

.right div#middle .background {

background: none;

}



div#left {

width: 210px; 



}



.left div#middle div#left {

float: left;

}



.right div#middle div#left {

float: right;

}



div#main {

width: auto;



}



 

div#main {

margin: 0px 0px 0px 0px;

padding: 0px 0px 0px 0px;

}



 

.left div#main {

margin: 0px 0px 0px 225px; 

}



 

.right div#main {

margin: 0px 225px 0px 0px; 

}



div#main div.main-container-t {

padding: 0px 10px 0px 10px;

position: relative;

}



div#main div.main-t {

height: 10px;

background: #ffffff;

}



div#main div.main-tl {

position: absolute;

top: 0px;

left: 0px;

width: 10px;

height: 10px;

background: url(../images/main_tl.png) 0 0 no-repeat; /* ie6png:scale */

}



div#main div.main-tr {

position: absolute;

top: 0px;

right: 0px;

width: 10px;

height: 10px;

background: url(../images/main_tr.png) 0 0 no-repeat; /* ie6png:scale */

}



div#main div.main-m {

padding: 5px 15px 5px 15px;

min-height: 300px;

overflow: hidden;

background: #ffffff;

}



div#main div.main-container-b {

padding: 0px 10px 0px 10px;

position: relative;

}



div#main div.main-b {

height: 10px;

background: #ffffff;

}



div#main div.main-bl {

position: absolute;

top: 0px;

left: 0px;

width: 10px;

height: 10px;

background: url(../images/main_bl.png) 0 0 no-repeat; /* ie6png:scale */

}



div#main div.main-br {

position: absolute;

top: 0px;

right: 0px;

width: 10px;

height: 10px;

background: url(../images/main_br.png) 0 0 no-repeat; /* ie6png:scale */

}



div#maintop {

padding: 0px 0px 15px 0px;

}



div#mainmiddle {

margin: 0px 0px 15px 0px;





}



.showright div#mainmiddle { 

background: url(../images/right_bg.png) 100% 0 repeat-y;

}



div#right {

width: 180px; 

margin: 0px 0px 0px 0px;

padding: 0px 0px 0px 0px;

float: right;

}



div#content {

width: auto;



}



 

div#content {

margin: 0px 0px 0px 0px;

}



 

.showright div#content {

margin: 0px 210px 0px 0px; 

}



div#contenttop {

margin: 0px 0px 15px 0px;

}



div#breadcrumbs {

margin-bottom: 10px;

font-size: 85%;

}



div#contentbottom {

margin: 15px 0px 0px 0px;

}



div#mainbottom {

padding: 0px 0px 0px 0px;

}



div#bottom {

width: auto; 

margin: 0px 0px 0px 0px;

padding: 0px 5px 15px 5px;

clear: both; 

}



div#bottom .bottomblock {

margin-top: 15px;

margin-bottom: -15px;

}



div#footer {

width: auto; 

min-height: 50px;



margin: 0px 0px 0px 0px;

padding: 0px 5px 0px 5px;

clear: both; 

text-align: center;

color: #323232;

}



div#footer a:link, div#footer a:visited {

color: #323232;

}



div#footer a:hover {

color: #323232;

}



div#footer a.anchor {

margin: 0px 0px 0px 0px;

width: 50px;

height: 10px;

background: url(../images/footer_anchor.png) 0 0 no-repeat;

display: block;

float: right;

text-decoration: none;

}



/*

 * Clearing & Floating

 */



 

 

.clearfix:after {

content: ".";

display: block;

height: 0; 

clear: both;

visibility: hidden;

}



 

.clearfix { display: block; }



 

.floatbox { overflow:hidden; }



.float-left { float: left; overflow: hidden; }

.float-right { float: right; overflow: hidden; }



.width15 { width: 14.999%; }

.width18 { width: 18.333%; }

.width20 { width: 19.999%; }

.width23 { width: 22.999%; }

.width25 { width: 24.999%; }

.width33 { width: 33.333%; }

.width35 { width: 34.999%; }

.width40 { width: 39.999%; }

.width45 { width: 44.999%; }

.width50 { width: 49.999%; }

.width54 { width: 53.999%; }

.width65 { width: 64.999%; }

.width75 { width: 74.999%; }

.width100 { width: 100%; }




Вот сайт http://im-narod.com/
Приложил скрин из IE7



[вложение удалено Администратором]
*

Sergvideo

  • Осваиваюсь на форуме
  • 41
  • 3 / 0
Итак после продолжительной борьбы с ИЕ и своими кривыми руками вот что получилось:

ie7hacks.css

Код: css
/* Joomla */
div#yoo-search input {
width: 91px;
}

div#menubar {
margin-top:130px;
height: 55px;
}

#top .topblock div.module {

margin: 15px 0px 0px 0px;

}

/* general */
ol.disc {
padding: 0px 0px 0px 50px;
}

ol.disc li {
padding-left: 5px;
}

hr.dotted {
background: none;
border: dotted 1px #c8c8c8;
}

p.dropcap:first-letter {
line-height: 110%;
}


Меню отображается как надо, НО! Есть одно "НО", не отображаются баннера ((
Думал поправив проблему с меню, проблема с баннерами исчезнет, но нет, не исчезла, баннера все так-же не отображаются. немогу найти причину.... Дайте пожалуйста кто-нибудь совет...
*

gdX

  • Глобальный модератор
  • 995
  • 128 / 0
  • Открыт к заказам по дизайну
*

Sergvideo

  • Осваиваюсь на форуме
  • 41
  • 3 / 0
В нормальных браузерах типа ФФ, Опера, Гугл хром, Сафари - сайт отображается нормально, но в ИЕ (кроме последнего (8-й, если не ошибаюсь)), не отображается. Понятно, что режет браузер, вопрос в том: как сделать, чтоб не резал?
*

gdX

  • Глобальный модератор
  • 995
  • 128 / 0
  • Открыт к заказам по дизайну
С левым меню в ie6 тоже косяки.
Да и скриптовые ошибки показывает.
На счет баннера — скорее всего не верный код подстановки там, проверьте его.
*

Sergvideo

  • Осваиваюсь на форуме
  • 41
  • 3 / 0
Мда. С баннерами разобрался тоже...

Код: css
<div style="text-align: center;">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="950" height="80">
  <param name="movie" value="/images/Banner.swf" />
  <param name="quality" value="high" />
  <param name="allowScriptAccess" value="always" />
  <param name="wmode" value="transparent">
     <embed src="/images/Banner.swf"
      quality="high"
      type="application/x-shockwave-flash"
      WMODE="transparent"
      width="950"
      height="80"
      pluginspage="http://www.macromedia.com/go/getflashplayer"
      allowScriptAccess="always" />
</object>
</div>
 
У меня было вставленно так  <param name="movie" value="Banner.swf" /> а надо так    <param name="movie" value="/images/Banner.swf" />

А вот как с ошибками скроптов и касяком меню в ИЕ 6 пока не разобрался... мож кто посоветует как исправить?  :D
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Кликабельность псевдоэлемента в пункте меню

Автор vasilii.pupkov

Ответов: 4
Просмотров: 3435
Последний ответ 29.12.2021, 23:15:38
от v42bis
Проблема с таблицей при просмотре с мобильника

Автор annetkas

Ответов: 5
Просмотров: 2261
Последний ответ 19.11.2021, 14:06:15
от effrit
Выпадающее меню

Автор DrShepard

Ответов: 10
Просмотров: 2971
Последний ответ 20.10.2021, 12:36:16
от DrShepard
Как закруглить края выпадающего меню?

Автор coliandra

Ответов: 1
Просмотров: 1459
Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

Ответов: 2
Просмотров: 1374
Последний ответ 27.11.2020, 11:33:58
от coliandra