Template Style.css question

[lionzden]

Code Select Expand

#vanity a {
        display:block;
        width:57px;
        height:20px;
        margin: 3px 20px;
}
#vanity img {border:0}
#v_php {float:left;background-image:url(../../images/powered-php.gif);}
#v_php:hover {background-image:url(../../images/h_powered-php.gif);}
#v_mysql {float:left;background-image:url(../../images/powered-mysql.gif);}
#v_mysql:hover  {background-image:url(../../images/h_powered-mysql.gif);}
#v_xhtml {float:right;background-image:url(../../images/valid-xhtml10.gif);}
#v_xhtml:hover {background-image:url(../../images/h_valid-xhtml10.gif);}
#v_css {float:right;background-image:url(../../images/valid-css.gif);}
#v_css:hover{background-image:url(../../images/h_valid-css.gif);}

.listbox_lang{
font-size: 9;
width: 100px;
}

.textinput {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
border: 1px solid #DCD1DA;
padding-right: 3px;
padding-left: 3px;
}

.shoutboxbutton{
background-color: #ff6600;
width: 120;
font-size: 12;
border-color: black;
border-width: 1px;
font-family: arial, verdana, geneva;
color: black;
}

.button{
background-color: #ff6600;
font-size: 12;
border-color: black;
border-width: 1px;
font-family: arial, verdana, geneva;
color: black;
}


.pms_send_a {
background-color: white;
}

.pms_send_b {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.onlinestats
{
font-size: 11px;
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0;
padding: 10px;
}

.pms_linecolor1
{
background-color: #ff6600;
font-size: 10px;
}
.pms_linecolor2
{
background-color: #FFB27E;
font-size: 10px;
}
.pms_linecolor3
{
background-color: #FFF8F3;
font-size: 10px;
}
.pms_linecolor4
{
background-color: #f8f8f8;
font-size: 10px;
}
.pms_linecolor5
{
background-color: #FED7BD;
font-size: 10px;
}
.pms_legend
{
        margin: 20px;
}

.pms_message_border
{
border: 1px inset;
background-color: #f8f8f8;
font-family: verdana, arial, helvetica, sans-serif;
}

.panel
{
background: #f8f8f8;
color: #000000;
padding: 10px;
border: 1px outset;
}
.panelsurround
{
background: white;
color: black;
}
td.thead, div.thead { padding: 4px; }
.smallfont
{
font: 11px verdana, arial, helvetica, sans-serif;
}
.alt1, .alt1Active
{
background-color: white;
font-family: verdana, arial, helvetica, sans-serif;
}
.alt2, .alt2Active
{
background-color: #f8f8f8;
font-family: verdana, arial, helvetica, sans-serif;
}
.alt3
{
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.maintable {
        background: white ;
        color : #333;
        padding-top: 0px;
        padding-bottom: 0px;
        padding-left:10px;
        padding-right: 10px;
}

.tableh2 {
        background: white ;
        color : #333;
        padding-top: 0px;
        padding-bottom: 0px;
}

.album_stat {
        font-size : .85em;
        margin: 5px 0px;
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0;
padding: 5px;
}

.thumb_title {
        font-size: 1em;
        padding: 2px;
        display : block;
}

.thumb_caption {
        font-size: .85em;
        padding-bottom: 10px;
        display : block;
}

.thumb_num_comments {
        font-weight: normal;
        font-size: 1em;
        padding: 0px;
        font-style : normal;
        display : block;
}

.user_thumb_infobox {
        margin-top: 1px;
        margin-bottom: 1px;
}

.user_thumb_infobox th {
        font-weight : bold;
        font-size: 1em;
        margin-top: 1px;
        margin-bottom: 1px;
        text-align : center;
}

.user_thumb_infobox td {
        font-size: .9em;
        margin-top: 1px;
        margin-bottom: 1px;
        text-align : center;
}

.sortorder_cell {
        background : white ;
        color : #333;
        padding: 2px;
        margin: 0px;
}

.sortorder_options {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        background : white ;
        color : #333;
        padding: 0px;
        margin: 0px;
        font-weight: normal;
        font-size: .85em;
        white-space: nowrap;
}


.admin_menu {
        font-family: Verdana, Helvetica, sans-serif;
        font-size: 10px;
        color:gray;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-right:2px;
        margin-left:2px;
        text-align: center;
        background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

.footer {
        font-size: 10px;
        color: #000000;
}

.footer a {
        text-decoration: none;

}

.footer a:hover {
        color: #000000;
        text-decoration: none;
}

.catlink {
    display: block;
padding: 0;
margin: 18px 0 0;
font-size: 16px;
font-weight: bold;

}

/* End Legacy Styles */

/* Begin Lists

Special stylized non-IE bullets
Do not work in Internet Explorer, which merely default to normal bullets. */

html>body .entry ul {
margin-left: 0px;
padding: 0 0 0 10px;
list-style: none;
padding-left: 0px;
text-indent: -10px;
}

html>body .entry li {
margin: 0px 0px 0px 0px;
}

.entry ul li:before, #sidebar ul ul li:before {

}

.entry ol {
padding: 0 0 0 35px;
margin: 0;
}

.entry ol li {
margin: 0;
padding: 0;
}

.postmetadata ul, .postmetadata li {
display: inline;
list-style-type: none;
list-style-image: none;
}

#sidebar ul, #sidebar ul ol {
margin: 0;
padding: 0;
}

#sidebar ul li {
list-style-type: none;
list-style-image: none;
margin-bottom: 2px;
margin-left: 4px;
}

#sidebar ul p, #sidebar ul select {
margin: 5px 0 8px;
}

#sidebar ul ul, #sidebar ul ol {
margin: 5px 0 0 10px;
}

#sidebar ul ul ul, #sidebar ul ol {
margin: 0 0 0 10px;
}

ol li, #sidebar ul ol li {
list-style: decimal outside;
}

#sidebar ul ul li, #sidebar ul ol li {
margin: 3px 0 0;
padding: 0;
}
/* End Entry Lists */

/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
cursor: help;
}

acronym, abbr {
border-bottom: 1px dashed #999;
}

blockquote {
margin: 15px 30px 0 10px;
padding-left: 20px;
border-left: 5px solid #ddd;
}

blockquote cite {
margin: 5px 0 0;
display: block;
}

.center {
text-align: center;
}

hr {
color: gray
}

.navigation {
display: block;
text-align: center;
margin-top: 10px;
margin-bottom: 60px;
}
/* End Various Tags & Classes*/

/* Begin Sidebar */
#sidebar
{
}

#sidebar form {
margin: 0;
}
/* End Sidebar */

/* Begin Images */
p img {
padding: 0;
max-width: 100%;
}

/* Using 'class="alignright"' on an image will (who would've
thought?!) align the image to the right. And using 'class="centered',
will of course center the image. This is much better than using
align="center", being much more futureproof (and valid) */

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


img.image {
padding: 0px;
margin: 0px 0px 0px 0px;
display: inline;
float: center;
border-style: solid;
border-width:1px;
border-color: #000000;
}


img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left
}
/* End Images */

/* Begin Structure */
body {
margin: 0px;
padding: 0;
}

#page {
background-color: white;
margin: 20px auto;
padding: 0;
width: 760px;
border: 1px solid #959596;
}

#header {
padding: 0;
margin: 0 auto;
height: 200px;
width: 100%;
background-color: #73a0c5;
}

#headerimg {
margin: 0;
height: 200px;
width: 100%;
}

.narrowcolumn {
float: left;
padding: 0 0 20px 45px;
margin: 0px 0 0;
width: 450px;
}

.widecolumn {
padding: 10px 0 20px 0;
margin: 5px 0 0 150px;
width: 450px;
}

.post {
margin: 0 0 40px;
text-align: justify;
line-height: 1.6em
font-size: 1.2em
}

.widecolumn .post {
margin: 0;
}

.narrowcolumn .postmetadata {
padding-top: 5px;
}

.widecolumn .postmetadata {
margin: 30px 0;
}

#footer {
padding: 0;
margin: 0 auto;
width: 760px;
clear: both;
}

#footer p {
margin: 0;
padding: 20px 0;
text-align: center;
}
/* End Structure */


/* Begin Headers */
h1 {
padding-top: 4px;
margin: 0;
}

h2 {
margin: 20px 0 0;
}

.h2_nomargin{
margin: 0px;
}

h2.pagetitle {
margin-top: 20px;
text-align: center;
}

#sidebar h2 {
margin: 5px 0 0;
padding: 0;
}

h3 {
padding: 0;
margin: 20px 0 0;
}

h3.comments {
padding: 0;
margin: 40px auto 20px ;
}

h4 {
padding: 0;
margin: 20px 0 0;
font-size: 16px;
}
/* End Headers */

/* Begin Form Elements */
#searchform {
margin: 10px auto;
padding: 5px 3px;
text-align: center;
}

#sidebar #searchform #s {
width: 130px;
padding: 2px;
}

#sidebar #searchsubmit {
padding: 1px;
}

.entry form { /* This is mainly for password protected posts, makes them look better. */
text-align:center;
}

select {
width: 130px;
}

#commentform input {
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
}

#commentform textarea {
width: 100%;
padding: 2px;
}

#commentform #submit {
margin: 0;
float: right;
}
/* End Form Elements */

/* Begin Comments*/
.graybox {
margin: 0;
padding: 10px;
}

.commentlist {
padding: 0;
text-align: justify;
}

.commentlist li {
margin: 15px 0 3px;
padding: 5px 10px 3px;
list-style: none;
}

.commentlist p {
margin: 10px 5px 10px 0;
}

#commentform p {
margin: 5px 0;
}

.nocomments {
text-align: center;
margin: 0;
padding: 0;
}

.commentmetadata {
margin: 0;
}
/* End Comments */

/* Begin Typography & Colors */
body {
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
background-color: #f8f8f8;
color: #333;
text-align: center;
}

#page {
background-color: white;
border: 1px solid #959596;
text-align: left;
}

#header {
background-color: #73a0c5;
}

#content {
font-size: 1.2em
}

.widecolumn .entry p {
font-size: 1.05em;
}

.narrowcolumn .entry, .widecolumn .entry {
line-height: 1.4em;
}

.widecolumn {
line-height: 1.6em;
}

.narrowcolumn .postmetadata {
text-align: center;
}

.graybox {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

.graybox2 {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}


.sortorder_cell {
background-color: #f8f8f8;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
margin: 0px;
padding: 0px;
}

.sortorder_options {
font-size: .5em;
padding: 0px;
margin: 0px
}

#footer {
background-color: #eee;
}

small {
font-family: Arial, Helvetica, Sans-Serif;
font-size: 0.9em;
line-height: 1.5em;
}

h1, h2, h3 {
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-weight: bold;
}

h1 {
font-size: 2em;
padding-left: 15px;
}

.description {
font-size: 1.1em;
text-align: left;
padding-left: 15px;
}

h2 {
font-size: 1.6em;
}

.h2_nomargin {
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-weight: bold;
font-size: 1.6em;
color: #333;
}


h2.pagetitle {
font-size: 1.6em;
}

#sidebar h2 {
font-family: 'Lucida Grande', Verdana, Sans-Serif;
font-size: 1.2em;
}

h3 {
font-size: 1.3em;
}

h1, h1 a, h1 a:hover, h1 a:visited, .description {
text-decoration: none;
color: black;
}

h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
color: #333;
}

h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
text-decoration: none;
}

.entry p a:visited {
color: #b85b5a;
}

.commentlist li, #commentform input, #commentform textarea {
font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

.commentlist li {
font-weight: bold;
}

.commentlist p {
font-weight: normal;
line-height: 1.5em;
text-transform: none;
}

.commentmetadata {
font-weight: normal;
}


small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
color: #777;
}

code {
font: 1.1em 'Courier New', Courier, Fixed;
}

acronym, abbr, span.caps
{
font-size: 0.9em;
letter-spacing: .07em;
}

a, h2 a:hover, h3 a:hover {
color: #ff6600;
text-decoration: none;
}

a:hover {
color: black;
text-decoration: underline;
}


td {font-size: 12px;}

.comment_body span {font: 1.2em; font-weight: normal;}

.debug_text {
        border: #BDBEBD;
        background-color: white;
        width : 100%;
        margin : 0px;
}-------------------------------------------

i want to add:

scrollbar-base-color: white;
scrollbar-face-color: white;
scrollbar-arrow-color: darkorange;
scrollbar-3dlight-color: darkorange;
scrollbar-highlight-color: white;
scrollbar-shadow-color: darkorange;
scrollbar-darkshadow-color: darkorange">

could someone add it to the above style.css i the right place cos i'm lost?!

[Joachim Müller]

add it into the body section. You have several sections already that define properties, but this doesn't matter. Add anywhere (usually you do this at the very top of the stylesheet)

Code Select Expand

body {
    scrollbar-base-color: white;
    scrollbar-face-color: white;
    scrollbar-arrow-color: darkorange;
    scrollbar-3dlight-color: darkorange;
    scrollbar-highlight-color: white;
    scrollbar-shadow-color: darkorange;
    scrollbar-darkshadow-color: darkorange
}

[Bloom]

add it into the body section. You have several sections already that define properties, but this doesn't matter. Add anywhere (usually you do this at the very top of the stylesheet)

Code Select Expand

body {
    scrollbar-base-color: white;
    scrollbar-face-color: white;
    scrollbar-arrow-color: darkorange;
    scrollbar-3dlight-color: darkorange;
    scrollbar-highlight-color: white;
    scrollbar-shadow-color: darkorange;
    scrollbar-darkshadow-color: darkorange
}

I tried that, the scrollbar still stays the same. Coppermine is starting to REALLY annoy me now...

Is there another way I can colour the scrollbars?

[Joachim Müller]

People with an attitude like yours annoy me, so I suggeste reviewing yours! Post a link to your page instead if you must hijack this thread. It's not coppermine that is to blame if you're not smart enough to edit your stylesheet on your own

[yaniv]

hey, I am having the same problem..

I have stuck it in the style css, in the body section and no joy,
I tried it in the template.htm file as well and still nothing...

any reason it shouldn't work? Or am I just doing something really dumb.

Thank's in advance!

[Nibbler]

Post a link. If you hijack a thread at least read it first

[silly_walk]

I tried that, the scrollbar still stays the same. Coppermine is starting to REALLY annoy me now...

Is there another way I can colour the scrollbars?

What browser are you testing with? I've never seen Firefox use the scrollbar settings, for example.

[Nibbler]

Only IE and Opera allow such a feature to my knowledge.

[yaniv]

no worried i was just being a noob... got it to work, in the body tag..
thanks all of you!