Подключить свой css для Opera

spoilb · April 3, 2012

Добрый день. Есть проблемка. Сделал над хедером полоску дополнительную, Google, Safari, FF всё отлично, в Опере она торчит на половину, другая половина вне экрана, хочу создать ещё один CSS отдельно для Opera и там спустить её немножко. Использую Wordpress. Подскажите как сделать, буду очень благодарен :rolleyes:

alexandr_v-vich · April 3, 2012

Пишем обычный адрес css. И добавляем код, что ниже в <head>. Желательно перед объявлением стилей.

<script>if(window.opera) {getElementsBtTagName('link')[0].setAttribute('href')="ссылка на ваш css"}</script>

Это ("[0]") - если нужный тег link у вас - самый первый тег link. Если нет, то высчитайте, помня, что 0 - это первый элемент, 1 - второй и т.д.

Edited April 3, 2012 by alexandr_v-vich

NeoXidizer · April 3, 2012

можно же просто

</style>

dostel1 · April 3, 2012

alexandr_v-vich пасиб Edited April 3, 2012 by dostel1

alexandr_v-vich · April 3, 2012

можно же просто
<style type="opera/css">
</style>

Да, проще будет. Только это просто добавит ещё стилей, оставив и стандартные.

UPD:

И если я не ошибаюсь эти стили подхватит и Safari...

dostel1, ознакомляемся

http://www.xiper.net/collect/js-plugins/browser-detect/browser-name-and-version.html

Edited April 3, 2012 by alexandr_v-vich

NeoXidizer · April 3, 2012

хотя, мой пример в опере11 не работает

Использую Wordpress.

можно прямо в header.php определять браузер пользователя через $_SERVER['HTTP_USER_AGENT'] + get_browser и подключать нужный стиль для нужного браузера. Хотя, это плохой тон, лучше сразу верстать кроссбраузерно с минимумом хаков. Edited April 3, 2012 by NeoXidizer

lexxcode · April 3, 2012

Мне кажется лучше пересмотреть корректность верстки вашего элемента и сделать нормально и кроссбраузерно. Но если уж действительно экзотика, то тогда css-хак для оперы поставить

spoilb · April 3, 2012

Может можно как то исправить, может воды налил, если не тяжело может кто то глянет. Я не проффи, но немного знаком :rolleyes:

http://rebl.biz/

моя CSSka

/*
Theme Name: op3
Theme URI: 
Description: Artisteer-generated theme
Version: 1.0
Author: 
Author URI: 
Tags: fixed width, right sidebar, two columns, valid XHTML, widgets
*/

/* begin Page */
/* Created by Artisteer v3.0.0.33215 */

/*member begin*/
div.art-member {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
div.art-member-center {

}
div.art-member-jpeg {
    background-image: url("images/member.gif");
    background-position: center center;
    background-repeat: no-repeat;
    height: 28px;
    position: absolute;
    top: -17px;
    left: 20px;
    width: 709px;
    z-index: 10005;
}
/*member end*/





/*mycart begin*/
div.art-mycart {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
div.art-mycart-center {

}
div.art-mycart-jpeg {
    background-image: url("images/mycart1.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 1080px;
    width: 137px;
    z-index: 10001;
}
div.art-mycart-jpeg:hover {
    background-image: url("images/mycart2.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 1080px;
    width: 137px;
    z-index: 10001;
}
/*mycart end*/






/*login begin*/
div.art-login {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
div.art-login-center {

}
div.art-login-jpeg {
    background-image: url("images/login1.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 915px;
    width: 137px;
    z-index: 10001;
}
div.art-login-jpeg:hover {
    background-image: url("images/login2.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 915px;
    width: 137px;
    z-index: 10001;
}
/*login end*/
/*register begin*/
div.art-register {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
div.art-register-center {

}
div.art-register-jpeg {
    background-image: url("images/reg1.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 750px;
    width: 137px;
    z-index: 10001;
}
div.art-register-jpeg:hover {
    background-image: url("images/reg2.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 31px;
    position: absolute;
    top: -18px;
    left: 750px;
    width: 137px;
    z-index: 10001;
}
/*register end*/
/*hz begin tel*/
div.art-tel {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}

div.art-tel-jpeg {
    background-image: url("images/poloska.png");
    background-position: center center;
    background-repeat: no-repeat;
    height: 45px;
    position: absolute;
    top: -26px;
    width: 1263px;
    z-index:10000;

}
/*hz end tel*/
/*hz begin*/
div.art-kok {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
div.art-kok-center {
    position: absolute;
    width: 1263px;
}
div.art-kok-jpeg {
    background-image: url("images/");
    background-position: center center;
    background-repeat: no-repeat;
    height: 26px;
    position: absolute;
    top: -27px;
    left: -30px;
    width: 200px;
    z-index: 1000000;
}
/*hz end*/
.qtrans_language_chooser { list-style-type:none; }
.qtrans_language_chooser li { float : right; margin-right: 10px;
position: relative;
z-index: 1000000;
top: 13px; }










#art-main, table
{
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 13px;
}

h1, h2, h3, h4, h5, h6, p, a, ul, ol, li
{
    margin: 0;
    padding: 0;
}

body
{
  margin: 0 auto;
  padding: 0;
  color: #0F1419;
  background-color: #F9FAFB;
  background-image: url('images/Bottom_texture.jpg');
  background-repeat: repeat-x;
  background-attachment: fixed;
  background-position: top left;
}

.art-postcontent,
.art-postcontent li,
.art-postcontent table,
.art-postcontent a,
.art-postcontent a:link,
.art-postcontent a:visited,
.art-postcontent a.visited,
.art-postcontent a:hover,
.art-postcontent a.hovered
{
    font-family: Arial, Helvetica, Sans-Serif;
}

.art-postcontent p
{
    margin: 12px 0 12px 0;
}

h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link,
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 32px;
}

.art-postcontent a
{
  text-decoration: none;
  color: #2F617F;
}

.art-postcontent a:link
{
  text-decoration: none;
  color: #2F617F;
}

.art-postcontent a:visited, .art-postcontent a.visited
{

  color: #2F617F;
}

.art-postcontent  a:hover, .art-postcontent a.hover
{

  text-decoration: underline;
  color: #3E81A8;
}


.art-postcontent h1
{
   margin: 21px 0 21px 0; 
   color: #2F617F;

}

.art-postcontent h2
{
    color: #3E81A8;
   margin: 19px 0 19px 0; 
   font-size: 24px;   
}

.art-postcontent h3
{
   margin: 19px 0 19px 0; 
  color: #41576C; 
  font-size: 19px;    
}

.art-postcontent h4
{
   margin: 20px 0 20px 0; 
   color: #3D5266; 
   font-size: 16px;   
}

.art-postcontent h5
{
   margin: 26px 0 26px 0; 
   color: #3D5266;   
   font-size: 13px;
}

.art-postcontent h6
{
   margin: 35px 0 35px 0; 
   color: #3D5266;
   font-size: 11px;      
}

ul
{
  list-style-type: none;
}

ol
{
  list-style-position: inside;
}

#art-main
{
  position: relative;
  width: 100%;
  left: 0;
  top: 0;
  cursor:default;
}




.cleared
{
  float: none;
  clear: both;
  margin: 0;
  padding: 0;
  border: none;
  font-size: 1px;
}

form
{
  padding: 0 !important;
  margin: 0 !important;
}

table.position
{
  position: relative;
  width: 100%;
  table-layout: fixed;
}
/* end Page */

/* begin Box, Sheet */
.art-sheet
{
  position: relative;
  margin: 0 auto;
  min-width: 25px;
  min-height: 25px;
}

.art-sheet-body
{
  position: relative;
  padding: 4px;
}

.art-sheet-tr, .art-sheet-tl, .art-sheet-br, .art-sheet-bl, .art-sheet-tc, .art-sheet-bc,.art-sheet-cr, .art-sheet-cl
{
  position: absolute;
}

.art-sheet-tr, .art-sheet-tl, .art-sheet-br, .art-sheet-bl
{
  width: 36px;
  height: 36px;
  background-image: url('images/sheet_s.png');
}

.art-sheet-tl
{
  top: 0;
  left: 0;
  clip: rect(auto, 18px, 18px, auto);
}

.art-sheet-tr
{
  top: 0;
  right: 0;
  clip: rect(auto, auto, 18px, 18px);
}

.art-sheet-bl
{
  bottom: 0;
  left: 0;
  clip: rect(18px, 18px, auto, auto);
}

.art-sheet-br
{
  bottom: 0;
  right: 0;
  clip: rect(18px, auto, auto, 18px);
}

.art-sheet-tc, .art-sheet-bc
{
  left: 18px;
  right: 18px;
  height: 36px;
  background-image: url('images/sheet_h.png');
}

.art-sheet-tc
{
  top: 0;
  clip: rect(auto, auto, 18px, auto);
}

.art-sheet-bc
{
  bottom: 0;
  clip: rect(18px, auto, auto, auto);
}

.art-sheet-cr, .art-sheet-cl
{
  top: 18px;
  bottom: 18px;
  width: 36px;
  background-image: url('images/sheet_v.png');
}

.art-sheet-cr
{
  right: 0;
  clip: rect(auto, auto, auto, 18px);
}

.art-sheet-cl
{
  left: 0;
  clip: rect(auto, 18px, auto, auto);
}

.art-sheet-cc
{
  position: absolute;
  top: 18px;
  left: 18px;
  right: 18px;
  bottom: 18px;
  background-color: #F9FAFB;
}

.art-sheet
{
  top: -10px !important;
  margin-bottom: -34px !important;
  cursor:auto;
  width: 1000px;
}


/* end Box, Sheet */

/* begin Header */





div.art-header
{
  margin: 0 auto;
  position: relative;
  width: 100%;
  height: 175px;
  overflow: hidden;
}


div.art-header-center
{
	position: relative;
	width: 992px;
	left:50%;
}












div.art-header-jpeg
{
  position: absolute;
  top: 0;
  left:-50%;
  width: 992px;
  height: 175px;
  background-image: url('images/header.jpg');
  background-repeat: no-repeat;
  background-position: center center;
}


/* end Header */

/* begin Logo */
div.art-logo
{
  display: block;
  position: absolute;
  left: 10px;
  top: 20px;
  width: 500px;
}

h1.art-logo-name
{
  display: block;
  text-align: {HorizontalAlign};
}

h1.art-logo-name, h1.art-logo-name a, h1.art-logo-name a:link, h1.art-logo-name a:visited, h1.art-logo-name a:hover
{
  font-size: 28px;
  text-decoration: none;
  padding: 0;
  margin: 0;
  color: {NameFontColor} !important;
}


h2.art-logo-text, 
h2.art-logo-text a,
h2.art-logo-text a:link,
h2.art-logo-text a:visited,
h2.art-logo-text a:hover
{
  font-size: 14px;
  padding: 0;
  margin: 0;
  color: {TextFontColor} !important;
}

h2.art-logo-text
{
  display: block;
  text-align: {HorizontalAlign};
}
/* end Logo */

/* begin Menu */
/* menu structure */

.art-menu a, .art-menu a:link, .art-menu a:visited, .art-menu a:hover
{
    outline: none;
}

.art-menu, .art-menu ul
{
  margin: 0;
  padding: 0;
  border: 0;
  list-style-type: none;
  display: block;
}

.art-menu li
{
  margin: 0;
  padding: 0;
  border: 0;
  display: block;
  float: left;
  position: relative;
  z-index: 5;
  background: none;
}

.art-menu li:hover
{
  z-index: 100;
  white-space: normal;
}

.art-menu li li
{
  float: none;
}

.art-menu ul
{
  visibility: hidden;
  position: absolute;
  z-index: 10;
  left: 0;
  top: 0;
  background: none;
}

.art-menu li:hover>ul
{
  visibility: visible;
  top: 100%;
}

.art-menu li li:hover>ul
{
  top: 0;
  left: 100%;
}

.art-menu:after, .art-menu ul:after
{
  content: ".";
  height: 0;
  display: block;
  visibility: hidden;
  overflow: hidden;
  clear: both;
}
.art-menu, .art-menu ul
{
  min-height: 0;
}

.art-menu ul
{
  background-image: url('images/spacer.gif');
  padding: 10px 30px 30px 30px;
  margin: -10px 0 0 -30px;
}

.art-menu ul ul
{
  padding: 30px 30px 30px 10px;
  margin: -30px 0 0 -10px;
}




/* menu structure */

.art-menu
{
  padding: 5px 5px 5px 5px;
}

.art-nav
{
  position: relative;
  min-height: 36px;
  z-index: 100;
}

.art-nav .l, .art-nav .r
{
  position: absolute;
  z-index: -1;
  top: 0;
  height: 100%;
  background-image: url('images/nav.png');
}

.art-nav .l
{
  left: 0;
  right: 0;
}

.art-nav .r
{
  right: 0;
  width: 992px;
  clip: rect(auto, auto, auto, 992px);
}


/* end Menu */

/* begin MenuItem */
.art-menu a
{
  position: relative;
  display: block;
  overflow: hidden;
  height: 26px;
  cursor: pointer;
  text-decoration: none;
}


.art-menu ul li
{
    margin:0;
    clear: both;
}


.art-menu a .r, .art-menu a .l
{
  position: absolute;
  display: block;
  top: 0;
  z-index: -1;
  height: 88px;
  background-image: url('images/menuitem.png');
}

.art-menu a .l
{
  left: 0;
  right: 4px;
}

.art-menu a .r
{
  width: 408px;
  right: 0;
  clip: rect(auto, auto, auto, 404px);
}

.art-menu a .t, .art-menu ul a, .art-menu a, .art-menu a:link, .art-menu a:visited, .art-menu a:hover
{
  text-align: left;
  text-decoration: none;
}

.art-menu a .t
{
  color: #F2F5F7;
  padding: 0 13px;
  margin: 0 4px;
  line-height: 26px;
  text-align: center;
}

.art-menu a:hover .l, .art-menu a:hover .r
{
  top: -31px;
}

.art-menu li:hover>a .l, .art-menu li:hover>a .r
{
  top: -31px;
}

.art-menu li:hover a .l, .art-menu li:hover a .r
{
  top: -31px;
}
.art-menu a:hover .t
{
  color: #FFFFFF;
}

.art-menu li:hover a .t
{
  color: #FFFFFF;
}

.art-menu li:hover>a .t
{
  color: #FFFFFF;
}


.art-menu a.active .l, .art-menu a.active .r
{
  top: -62px;
}

.art-menu a.active .t
{
  color: #E7F2F9;
}
/* end MenuItem */

/* begin MenuSeparator */
.art-menu .art-menu-li-separator
{
  display: block;
  width: 8px;
  height:26px;
}
.art-nav .art-menu-separator
{
  display: block;
  margin:0 auto;
  width: 1px;
  height: 26px;
  background-image: url('images/menuseparator.png');
}
/* end MenuSeparator */

/* begin MenuSubItem */
.art-menu ul a
{
  display: block;
  text-align: center;
  white-space: nowrap;
  height: 26px;
  width: 180px;
  overflow: hidden;
  line-height: 26px;
  background-image: url('images/subitem.png');
  background-position: left top;
  background-repeat: repeat-x;
  border-width: 0;
  border-style: solid;
}

.art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
{
  display: inline;
  float: none;
  margin: inherit;
  padding: inherit;
  background-image: none;
  text-align: inherit;
  text-decoration: inherit;
}

.art-menu ul a, .art-menu ul a:link, .art-menu ul a:visited, .art-menu ul a:hover, .art-menu ul a:active, .art-nav ul.art-menu ul span, .art-nav ul.art-menu ul span span
{
  text-align: left;
  text-indent: 12px;
  text-decoration: none;
  line-height: 26px;
  color: #0F2A38;
  font-size: 12px;
  margin:0;
  padding:0;
}

.art-menu ul li a:hover
{
  color: #000000;
  background-position: 0 -26px;
}

.art-menu ul li:hover>a
{
  color: #000000;
  background-position: 0 -26px;
}

.art-nav .art-menu ul li a:hover span, .art-nav .art-menu ul li a:hover span span
{
  color: #000000;
}

.art-nav .art-menu ul li:hover>a span, .art-nav .art-menu ul li:hover>a span span
{
  color: #000000;
}


/* end MenuSubItem */

/* begin Layout */
.art-content-layout
{
  display: table;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  background-color: Transparent;
  border: none !important;
  padding:0 !important;
}
.art-layout-cell, .art-content-layout-row
{
  background-color: Transparent;
  vertical-align: top;
  text-align: left;
  border: none !important;
  margin:0 !important;
  padding:0 !important;
}
.art-content-layout .art-content-layout{width: auto;margin:0;}
.art-content-layout .art-layout-cell, .art-content-layout .art-layout-cell .art-content-layout .art-layout-cell{display: table-cell;}
.art-layout-cell .art-layout-cell{display: block;}
.art-content-layout-row {display: table-row;}
.art-layout-glare{position:relative;}/* end Layout */

/* begin Button */
.art-button-wrapper a.art-button,
.art-button-wrapper a.art-button:link,
.art-button-wrapper input.art-button,
.art-button-wrapper button.art-button
{
  text-decoration: none;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 13px;
  position:relative;
  top:0;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  color: #FFFFFF !important;
  width: auto;
  outline: none;
  border: none;
  background: none;
  line-height: 32px;
  height: 32px;
  margin: 0 !important;
  padding: 0 16px !important;
  overflow: visible;
  cursor: pointer;
}

.art-button img, .art-button-wrapper img
{
  margin: 0;
  vertical-align: middle;
}

.art-button-wrapper
{
  vertical-align: middle;
  display: inline-block;
  position: relative;
  height: 32px;
  overflow: hidden;
  white-space: nowrap;
  width: auto;
  margin: 0;
  padding: 0;
  z-index: 0;
}

.firefox2 .art-button-wrapper
{
  display: block;
  float: left;
}

input, select, textarea
{
  vertical-align: middle;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 13px;
}

.art-block select 
{
    width:96%;
}

.art-button-wrapper.hover .art-button, .art-button-wrapper.hover a.art-button:link, .art-button:hover
{
  color: #F9FAFB !important;
  text-decoration: none !important;
}

.art-button-wrapper.active .art-button, .art-button-wrapper.active a.art-button:link
{
  color: #FFFFFF !important;
}

.art-button-wrapper .art-button-l, .art-button-wrapper .art-button-r
{
  display: block;
  position: absolute;
  height: 106px;
  margin: 0;
  padding: 0;
  background-image: url('images/button.png');
}

.art-button-wrapper .art-button-l
{
  left: 0;
  right: 10px;
}

.art-button-wrapper .art-button-r
{
  width: 409px;
  right: 0;
  clip: rect(auto, auto, auto, 399px);
}

.art-button-wrapper.hover .art-button-l, .art-button-wrapper.hover .art-button-r
{
  top: -37px;
}

.art-button-wrapper.active .art-button-l, .art-button-wrapper.active .art-button-r
{
  top: -74px;
}

.art-button-wrapper input
{
  float: none !important;
}
/* end Button */

/* begin Box, Block, VMenuBlock */
.art-vmenublock
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-vmenublock-body
{
  position: relative;
  padding: 0;
}


.art-vmenublock
{
  margin: 0;
}

/* end Box, Block, VMenuBlock */

/* begin BlockHeader, VMenuBlockHeader */
.art-vmenublockheader
{
  margin-bottom: 0;
}

.art-vmenublockheader, .art-vmenublockheader h3.t
{
  position: relative;
  height: 34px;
}

.art-vmenublockheader h3.t,
.art-vmenublockheader h3.t a,
.art-vmenublockheader h3.t a:link,
.art-vmenublockheader h3.t a:visited, 
.art-vmenublockheader h3.t a:hover
{
  color: #6382A1;
  font-size: 14px;
}

.art-vmenublockheader h3.t
{
  margin:0;
  padding: 0 10px 0 28px;
  white-space: nowrap;
  line-height: 34px;	
}

.art-vmenublockheader .l, .art-vmenublockheader .r
{
  position: absolute;
  height: 34px;
  background-image: url('images/vmenublockheader.png');
}

.art-vmenublockheader .l
{
  left: 0;
  right: 22px;
}

.art-vmenublockheader .r
{
  width: 992px;
  right: 0;
  clip: rect(auto, auto, auto, 970px);
}

/* end BlockHeader, VMenuBlockHeader */

/* begin Box, Box, VMenuBlockContent */
.art-vmenublockcontent
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-vmenublockcontent-body
{
  position: relative;
  padding: 0;
}


.art-vmenublockcontent
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-vmenublockcontent-body
{
  position: relative;
  padding: 0;
}


/* end Box, Box, VMenuBlockContent */

/* begin VMenu */
ul.art-vmenu, ul.art-vmenu li
{
  list-style: none;
  margin: 0;
  padding: 0;
  width: auto;
  line-height: 0;
}

ul.art-vmenu ul
{
  display: none;
}

ul.art-vmenu ul.active
{
  display: block;
}
/* end VMenu */

/* begin VMenuItem */
ul.art-vmenu a
{
  position: relative;
  display: block;
  overflow: hidden;
  height: 26px;
  cursor: pointer;
  text-decoration: none;
}

ul.art-vmenu li.art-vmenu-separator
{
  display: block;
  padding: 0 0 0 0;
  margin: 0;
  font-size: 1px;
}

ul.art-vmenu .art-vmenu-separator-span
{
  display: block;
  padding: 0;
  font-size: 1px;
  height: 0;
  line-height: 0;
  border: none;
}

ul.art-vmenu a .r, ul.art-vmenu a .l
{
  position: absolute;
  display: block;
  top: 0;
  height: 88px;
  background-image: url('images/vmenuitem.png');
}

ul.art-vmenu a .l
{
  left: 0;
  right: 17px;
}

ul.art-vmenu a .r
{
  width: 992px;
  right: 0;
  clip: rect(auto, auto, auto, 975px);
}

ul.art-vmenu a .t, ul.art-vmenu ul a
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}

ul.art-vmenu a .t
{
  display: block;
  position:relative;
  top:0;
  line-height: 26px;
  color: #7691AD;
  padding: 0 10px 0 22px;
  margin-left:0;
  margin-right:0;
}

ul.art-vmenu a.active .l, ul.art-vmenu a.active .r
{
  top: -62px;
}

ul.art-vmenu a.active .t
{
  color: #205A79;
}

ul.art-vmenu a:hover .l, ul.art-vmenu a:hover .r
{
  top: -31px;
}

ul.art-vmenu a:hover .t
{
  color: #6EABCF;
}


/* end VMenuItem */

/* begin VMenuSubItem */
ul.art-vmenu ul, ul.art-vmenu ul li
{
  margin: 0;
  padding: 0;
}

ul.art-vmenu ul a
{
  display: block;
  white-space: nowrap;
  height: 18px;
  overflow: visible;
  background-image: url('images/vsubitem.gif');
  background-position: 25px 0;
  background-repeat: repeat-x;
  padding-left: 25px;
}

ul.art-vmenu ul li
{
  padding: 0;
}

ul.art-vmenu ul span, ul.art-vmenu ul span span
{
  display: inline;
  float: none;
  margin: inherit;
  padding: inherit;
  background-image: none;
  text-align: inherit;
  text-decoration: inherit;
}

ul.art-vmenu ul a, ul.art-vmenu ul a:link, ul.art-vmenu ul a:visited, ul.art-vmenu ul a:hover, ul.art-vmenu ul a:active, ul.art-vmenu ul span, ul.art-vmenu ul span span
{
  line-height: 18px;
  color: #214559;
  font-size: 11px;
  margin-left: 0;
}

ul.art-vmenu ul
{
    margin:0 0 0 0;
}

ul.art-vmenu ul ul
{
  margin:0 0 0 0;
}

ul.art-vmenu ul li.art-vsubmenu-separator
{ 
  display: block;
  margin: 0;
  font-size: 1px;
  padding: 2px 0 2px 0;
 }

ul.art-vmenu ul .art-vsubmenu-separator-span
{
  display: block;
  padding: 0;
  font-size: 1px;
  height: 0;
  line-height: 0;
  margin: 0;
  border: none;
}

ul.art-vmenu ul li.art-vmenu-separator-first
{
    padding-bottom:0;
}

ul.art-vmenu ul li li a
{
  background-position: 50px 0;
  padding-left: 50px;
}

ul.art-vmenu ul li li li a
{
  background-position: 75px 0;
  padding-left: 75px;
}

ul.art-vmenu ul li li li li a
{
  background-position: 100px 0;
  padding-left: 100px;
}

ul.art-vmenu ul li li li li li a
{
  background-position: 125px 0;
  padding-left: 125px;
}


ul.art-vmenu ul li a.active
{
  color: #2E3D4C;
  background-position: 25px -46px;
}

ul.art-vmenu ul li li a.active
{
  background-position: 50px -46px;
}

ul.art-vmenu ul li li li a.active
{
  background-position: 75px -46px;
}

ul.art-vmenu ul li li li li a.active
{
  background-position: 100px -46px;
}

ul.art-vmenu ul li li li li li a.active
{
  background-position: 125px -46px;
}



ul.art-vmenu ul li a:hover, ul.art-vmenu ul li a:hover.active
{
  color: #1B242D;
  background-position: 25px -23px;
}


ul.art-vmenu ul li li a:hover, ul.art-vmenu ul li li a:hover.active
{
  background-position: 50px -23px;
}

ul.art-vmenu ul li li li a:hover, ul.art-vmenu ul li li li a:hover.active
{
  background-position: 75px -23px;
}

ul.art-vmenu ul li li li li a:hover, ul.art-vmenu ul li li li li a:hover.active
{
  background-position: 100px -23px;
}

ul.art-vmenu ul li li li li li a:hover, ul.art-vmenu ul li li li li li a:hover.active
{
  background-position: 125px -23px;
}
/* end VMenuSubItem */

/* begin Box, Block */
.art-block
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-block-body
{
  position: relative;
  padding: 3px;
}


.art-block
{
  margin: 10px;
}

/* end Box, Block */

/* begin Box, BlockContent */
.art-blockcontent
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-blockcontent-body
{
  position: relative;
  padding: 0;
}


.art-blockcontent-body, 
.art-blockcontent-body li, 
.art-blockcontent-body a,
.art-blockcontent-body a:link,
.art-blockcontent-body a:visited,
.art-blockcontent-body a:hover
{
  color: #2E3D4C;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 13px;
}

.art-blockcontent-body p
{
  margin: 6px 0 6px 0;
}

.art-blockcontent-body a
{
  color: #2F617F;

}

.art-blockcontent-body a:link
{
  color: #2F617F;

}

.art-blockcontent-body a:visited, .art-blockcontent-body a.visited
{
  color: #7691AD;
  text-decoration: none;
}

.art-blockcontent-body a:hover, .art-blockcontent-body a.hover
{
  color: #3E81A8;
  text-decoration: none;

}

.art-blockcontent-body ul li
{
  line-height: 125%;    
  color: #3D5266;

  padding: 0 0 0 11px;
  background-image: url('images/blockcontentbullets.png');
  background-repeat: no-repeat;
}/* end Box, BlockContent */

/* begin Box, Post */
.art-post
{
  position: relative;
  margin: 0 auto;
  min-width: 1px;
  min-height: 1px;
}

.art-post-body
{
  position: relative;
  padding: 7px;
}


.art-post
{
  margin: 7px;
}

a img
{
  border: 0;
}

.art-article img, img.art-article
{
  border: solid 0 #B2C2D1;
  margin: 10px;
}

.art-metadata-icons img
{
  border: none;
  vertical-align: middle;
  margin: 2px;
}

.art-article table, table.art-article
{
  border-collapse: collapse;
  margin: 1px;
}

.art-article th, .art-article td
{
  padding: 2px;
  border: solid 1px #8099B3;
  vertical-align: top;
  text-align: left;
}

.art-article th
{
  text-align: center;
  vertical-align: middle;
  padding: 7px;
}

pre
{
  overflow: auto;
  padding: 0.1em;
}

/* end Box, Post */

/* begin PostHeaderIcon */
h2.art-postheader
{
  color: #214559;
  margin: 5px 0 5px 0;
}

h2.art-postheader, 
h2.art-postheader a, 
h2.art-postheader a:link, 
h2.art-postheader a:visited,
h2.art-postheader a.visited,
h2.art-postheader a:hover,
h2.art-postheader a.hovered
{
  font-size: 24px;
}

h2.art-postheader a, h2.art-postheader a:link
{
  text-align: left;
  text-decoration: none;
  color: #28536C;
}

h2.art-postheader a:visited, h2.art-postheader a.visited
{

  color: #5C7A99;
}


h2.art-postheader a:hover,  h2.art-postheader a.hovered
{


  color: #3E81A8;
}

h2.art-postheader img
{
  border: none !important;
  vertical-align: middle;
  margin: 0 5px 0 0;
}
/* end PostHeaderIcon */

/* begin PostBullets */
.art-post ol, .art-post ul
{
  margin: 1em 0 1em 2em;
  padding: 0;
}

.art-post li
{
  font-size: 13px;
}

.art-post li ol, .art-post li ul
{
  margin: 0.5em 0 0.5em 2em;
  padding: 0;
}

.art-post li
{
  color: #2E3D4C; 

  padding: 0;
}


.art-post li
{
  padding: 0 0 0 10px;
}

.art-post ol>li
{
  background: none;
  padding-left: 0;/* overrides overflow for "ul li" and sets the default value */
  overflow: visible;
}

.art-post ul>li
{
  background-image: url('images/postbullets.png');
  background-repeat: no-repeat;
  padding-left: 10px;/* makes "ul li" not to align behind the image if they are in the same line */
  overflow-x: visible;
  overflow-y: hidden;
}


/* end PostBullets */

/* begin PostQuote */
.art-postcontent blockquote,
.art-postcontent blockquote a,
.art-postcontent blockquote a:link,
.art-postcontent blockquote a:visited,
.art-postcontent blockquote a:hover
{
  color: #061218;
  font-style: italic;
  font-weight: normal;
  text-align: left;
}

.art-postcontent blockquote p
{
   margin: 2px 0 2px 15px;
}

.art-postcontent blockquote
{
   border: solid 1px #82BEDE;
  margin: 10px 10px 10px 50px;
  padding: 12px 12px 12px 40px;
  background-color: #BFDDEE;
  background-image: url('images/postquote.png');
  background-position: left top;
  background-repeat: no-repeat;/* makes blockquote not to align behind the image if they are in the same line */
  overflow: auto;
}

/* end PostQuote */

/* begin PostIcons, PostFooterIcons */
.art-postfootericons,
.art-postfootericons a,
.art-postfootericons a:link,
.art-postfootericons a:visited,
.art-postfootericons a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  color: #3D5266;
}

.art-postfootericons
{
  padding: 1px;

}

.art-postfootericons a, .art-postfootericons a:link
{
  text-decoration: none;
  color: #2F617F;
}

.art-postfootericons a:visited, .art-postfootericons a.visited
{

  color: #2F617F;
}

.art-postfootericons a:hover, .art-postfootericons a.hover
{


  color: #3E81A8;
}
/* end PostIcons, PostFooterIcons */

/* begin Footer */
.art-footer
{
  position: relative;
  overflow: hidden;
  width: 100%;
}
div.art-footer
{
  margin: 0 auto;
  position: relative;
  width: 100%;
  height: 100px;
  overflow: hidden;
}


div.art-footer-center
{
	position: relative;
	width: 992px;
	left:50%;
}

div.art-footer-jpeg
{
  position: absolute;
  top: -43;
  left:-50%;
  width: 992px;
  height: 175px;
  background-image: url('images/footer.png');
  background-repeat: no-repeat;
  background-position: center center;
}




.art-footer-body
{
    position:relative;
    padding: 5px;
}


.art-footer-text p
{
  padding:10;
  margin:10;
}

.art-footer,
.art-footer a,
.art-footer a:link,
.art-footer a:visited,
.art-footer a:hover
{
    color: #192129;
    font-size: 11px;
}

.art-footer-text
{
  padding: 4 10px 4 10px;

}

.art-footer,
.art-footer-text,
.art-footer p
{
  text-align: center;
}

.art-footer a,
.art-footer a:link
{
  color: #295670;
  text-decoration: none;
}

.art-footer a:visited
{
  color: #394D60;

}

.art-footer a:hover
{
  color: #458FBA;

  text-decoration: underline;
}
/* end Footer */

/* begin PageFooter */
.art-page-footer, 
.art-page-footer a,
.art-page-footer a:link,
.art-page-footer a:visited,
.art-page-footer a:hover
{
  font-family: Arial;
  font-size: 15px;
  letter-spacing: normal;
  word-spacing: normal;
  font-style: normal;
  position: relative;
  font-weight: normal;
  text-decoration: underline;
  color: #5096BE;
}

.art-page-footer
{
  margin: 1em;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  top: 10px;
}
/* end PageFooter */

/* begin LayoutCell, content */




.art-content-layout .art-content .art-block
{
  background-color: #F9FAFB;
}
/* end LayoutCell, content */

/* begin LayoutCell, sidebar1 */

.art-content-layout .art-sidebar1
{
  background-color: #F9FAFB;
  width: 250px;
}

/* end LayoutCell, sidebar1 */



textarea#comment
{
    width:99%;
}

 ul#comments-list div.avatar
{
    float:right;    
}

ul#comments-list, ul#comments-list li
{
  background: none;
  padding:0;
}

ul#comments-list li li
{
  margin-left: 20px;
}

div.avatar
{
  position:relative;
  margin: 0 5px;
  border: 1px solid #aaa;
  padding: 1px;
  background: #fff;
  float:left;
}

div.avatar img, div.avatar img.wp-post-image
{
    margin:0 !important;
    padding:0;
    border:none;
}

ul#comments-list li cite
{
  font-size: 1.2em;
}

#commentform textarea
{
  width: 100%;
}

img.wp-smiley
{
  border: none;
  margin: 0;
  padding: 0;
}

.navigation
{
  display: block;
  text-align: center;
}

/* Recommended by http://codex.wordpress.org/CSS */
/* Begin */
.aligncenter, div.aligncenter, .art-article .aligncenter img, .aligncenter img.art-article, .aligncenter img, img.aligncenter
{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.alignleft
{
  float: left;
}

.alignright
{
  float: right;
}

.alignright img, img.alignright
{
  margin: 1em;
  margin-right: 0;
}

.alignleft img, img.alignleft
{
  margin: 1em;
  margin-left: 0;
}

.wp-caption
{
  border: 1px solid #ddd;
  background-color: #f3f3f3;
  padding-top: 4px;
  margin: 10px;
}

.wp-caption img
{
  margin: 0;
  padding: 0;
  border: 0 none;
}

.wp-caption p.wp-caption-text
{
  font-size: 11px;
  line-height: 17px;
  padding: 0 4px 5px;
  margin: 0;
}

.wp-caption, .wp-caption p
{
    text-align: center;
}
/* End */


.hidden
{
  display: none;
}

/* Calendar */
#wp-calendar {
  empty-cells: show;
  margin: 10px auto 0;
  width: 155px;
}

#wp-calendar #next a {
  padding-right: 10px;
  text-align: right;
}

#wp-calendar #prev a {
  padding-left: 10px;
  text-align: left;
}

#wp-calendar a {
  display: block;
}

#wp-calendar caption {
  text-align: center;
  width: 100%;
}

#wp-calendar td {
  padding: 3px 0;
  text-align: center;
}

.gallery {
  letter-spacing: normal;
}

.art-content {
  position: relative;
  z-index: 1;   
}

#todays-events{
  position: relative;
  z-index: 11;    
}

#upcoming-events{
  position: relative;
  z-index: 10;    
}

img.wp-post-image 
{
    margin:0 5px 5px 0 !important;
}

ul#comments-list li
{
    list-style-image: none;
    background:none;
    list-style-type:none;

}

div.art-footer div.art-content-layout
{
    margin:0 auto;
    width:100%;
}

div.art-layout-cell-size1 
{
    width:100%;
}

div.art-layout-cell-size2 
{
    width:50%;
}
div.art-layout-cell-size3 
{
    width:33%;
}

div.art-layout-cell-size4
{
    width:25%;
}


.art-widget-title
{
    padding:0 0 0 24px;
    margin-bottom:0;
}

div.art-center-wrapper
{
  position: relative;
  float: right;
  right: 50%;

}

div.art-center-inner
{
  position: relative;
  float: left;
  left: 50%;
}

div.art-center-inner
{
  float: none;
}

div.breadcrumbs h4, div.breadcrumbs p
{
    margin:0;
}

#respond p {
	margin: 0;
}

#respond .comment-notes {
	margin-bottom: 1em;
}

.form-allowed-tags {
	line-height: 1em;
}

h3#reply-title, h4#comments {
	margin: 0;
}

#comments-list #respond {
	margin-left: 20px;
}

#comments-list ul #respond {
	margin: 0;
}

#cancel-comment-reply-link {
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
}

#respond .required {
	color: #ff4b33;
	font-weight: bold;
}

#respond label {
	font-size: 12px;
}

#respond input {
	margin: 0 0 9px;
	width: 98%;
}

#respond textarea {
	width: 98%;
}

#respond .form-allowed-tags {
	font-size: 12px;
	line-height: 18px;
}

#respond .form-allowed-tags code {
	font-size: 11px;
}

#respond .form-submit {
	margin: 12px 0;
}

#respond .form-submit input {
	font-size: 14px;
	width: auto;
}

Edited April 3, 2012 by Softlink
Такие простыни заворачивайте в [ spoiler ]

alexandr_v-vich · April 3, 2012

Здесь не в стилях дело. Я не знаю как это всё работает, но Chrome мне показывает какие-то лишние(?) кавычки между body и первой обёрткой...

spoilb · April 3, 2012

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

Вот Хак который добавил перед body

<?php

$sBrowserClass = "";

if (preg_match("/Opera\W*(\d+(:?\.\d+)?)/",@$_SERVER["HTTP_USER_AGENT"], $aMatch)) {

    $sBrowserClass = "isOpera";

    if (@$aMatch[1] &&  $aMatch[1] < 9) {

        $sBrowserClass .= " isOpera8";

    }

} elseif (preg_match("/MSIE\W*(\d+(:?\.\d+)?)/",@$_SERVER["HTTP_USER_AGENT"], $aMatch)) {

    $sBrowserClass = "isIE";

    if (@$aMatch[1] &&  $aMatch[1] < 7) {

        $sBrowserClass .= " isIE6";

    }

}

if ($sBrowserClass) {

    $sBrowserClass = ' class="' . $sBrowserClass . '"';

}

?>

<body<?=$sBrowserClass?>>

далее по инстукции

Вот так теперь должен выглядеть наш css-файл:

#top_menu {

   margin: 0px 5px;

   overflow: hidden;

   background: #DAE0D2 url("/images/m_bg.gif") repeat-x bottom;

   padding-bottom: 1px;

   display: block;

}

.isIE #top_menu {

   height: 28px;

}

.isIE6 #top_menu {

   height: 30px;

   overflow: auto;

}

.isOpera #top_menu {

   margin-bottom: 6px;

}

Вот что у меня получилось

/*member begin*/
.isOpera div.art-member {
    height: 100%;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
.isOpera div.art-member-center {

}
.isOpera div.art-member-jpeg {
    background-image: url("images/member.gif");
    background-position: center center;
    background-repeat: no-repeat;
    height: 28px;
    position: absolute;
    top: -17px;
    left: 20px;
    width: 709px;
    z-index: 10005;
}
/*member end*/

что не правильно?

Sign In

Подключить свой css для Opera

Question

spoilb

Link to comment

Share on other sites

9 answers to this question

Recommended Posts

alexandr_v-vich

Link to comment

Share on other sites

NeoXidizer

Link to comment

Share on other sites

dostel1

Link to comment

Share on other sites

alexandr_v-vich

Link to comment

Share on other sites

NeoXidizer

Link to comment

Share on other sites

lexxcode

Link to comment

Share on other sites

spoilb

Link to comment

Share on other sites

alexandr_v-vich

Link to comment

Share on other sites

spoilb

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information