CSS Problems

[*midnight*magic*]

Hi,

Im new here but really need some help.
I have got the EsRaReNGiZ-EPIC2E theme. it's on my computer right now, its not actually online but it will be by the end of this month.

Anyway, the EsRaReNGiZ-EPIC2E theme has got quite a few different different stye sheets because it is a multi color theme. One style sheet for each color and one main style sheet if you know what I mean.

I went to edit one of the color style sheets, I didn't do anything to it, but some of it looks completely wrong. I will show you what I mean.

This is one bit of the style sheet...

Code Select Expand

a img

{

    border: 0px none;

}



.message_action

{

    background-color: #38315A;

    border: 1px solid #504E79;

    padding: 3px;

}



.explore

{

    color: #7A7691;

    background-color: #252238;

    padding-top: 4px;

    padding-bottom: 4px;

    padding-left: 4px;

    padding-right: 4px;

    margin-top: 7px;

    border: 1px solid #635C84;

    text-decoration: none;

}









.explore a:link, .explore a:visited

{

    color: #7A7691;

    font-size: 16px;

    font-weight: bold;

    text-decoration: none;

}



.explore a:hover

{

    color: #757CB0;

}



.board_posts

{

    background-color: #3E395E;

    border: 1px solid #504E79;

   

}



.board_posts a:link, .board_posts a:visited

{

    text-decoration: none;

    font-size: 14px;

}



.board_posts a:hover

{

    background-color: green;

    color: black;

}

.tree

{

    color: yellow;

    font-size: 14px;

}





.forum_name

{

    font-size: 20px;

    font-weight: bold;

    padding-top: 6px;

    padding-left: 29px;

    margin-top: 2px;

}



.new_post

{

    background-color: yellow;

    border: 1px solid red;

    padding: 1px;

    padding-left: 2px;

    padding-right: 2px;

}



/* Normal, standard links. */

a:link

{

    color: red;

    text-decoration: underline;

}

a:visited

{

    color: red; font-weight: bold;

    text-decoration: underline;

}



a:hover

{

color: lime;

}



/* Navigation links - for the link tree. */

.nav, .nav:link, .nav:visited

{

    color: #6A5ACD;

    text-decoration: none;

}

a.nav:hover

{

    font-weight: bold;

    color: #880055;

    text-decoration: underline;

}



/* Tables should show empty cells. */

table

{

    empty-cells: show;

}



/* By default (td, body..) use Tahoma in black. */

body, td, th

{

    color: #33ccff;

    font-size: 8pt;

    font-weight: bold;

    font-family: tahoma, sans-serif;

}



/* The main body of the entire forum. */

body

{

    background-color: #3E395E;

    margin-left: 40px;

    margin-right: 40px;

    border: 3px solid #6a5acd;

    padding: 3px;

}



/* Input boxes - just a bit smaller than normal so they align well. */

input, textarea, button

{

    font-size: 9pt;

    color: #ccc;

    background-color: #373355;

    border: 1px solid #48426D;

    font-family: tahoma, sans-serif;

    padding-left: 2px;

     padding-right: 2px;

}



/* All input elements that are checkboxes or radio buttons. */

input.check

{

}



/* Selects are a bit smaller, because it makes them look even better 8). */

select

{

    font-size: 8pt;

    font-weight: normal;

    color: red;

    background-color: #ffffe0;

    border: 1px solid #8A72C0;

    font-family: tahoma, sans-serif;

}



/* Standard horizontal rule.. ([hr], etc.) */

hr, .hrcolor

{

    height: 1px;

    border: 0px none;

    color: #504E79;

    background-color: #504E79

}



/* A quote, perhaps from another post. */

.quote

{

    color: #000000;

    background-color: #9B90CF;

    border: 1px dotted #000;

    margin: 1px;

    margin-top: 0px;

    padding: 2px;

    font-size: x-small;

    line-height: 1.4em;

}



/* A code block - maybe even PHP ;). */

.code

{

    color: #000000;

    background-color: #8D85B3;

    font-family: "courier new", "times new roman", monospace;

    font-size: small;

    line-height: 1.3em;

    /* Put a nice border around it. */

    border: 1px dotted #000;

    margin: 1px auto 1px auto;

    margin-top: 0px;

    padding: 2px;

    width: 99%;

    /* Don't wrap its contents, and show scrollbars. */

    white-space: nowrap;

    overflow: auto;

    /* Stop after about 24 lines, and just show a scrollbar. */

    max-height: 24em;

}



/* The "Quote:" and "Code:" header parts... */

.quoteheader, .codeheader

{

    color: #000000;

    background-color: #AEA6D5;

    margin-left: 1px;

    margin-right: 1px;

    padding: 3px;

    text-decoration: none;

    font-style: normal;

    font-weight: bold;

    font-size: small;

    line-height: 1.2em;

}



.quoteheader a:link, .quoteheader a:visited

{

    color: #000000;

}



/* Generally, those [?] icons.  This makes your cursor a help icon. */

.help

{

    cursor: help;

}



/* /me uses this a lot. (emote, try typing /me in a post.) */

.meaction

{

    color: red;

}



/* The main post box - this makes it as wide as possible. */

.editor

{

    width: 96%;

}



/* Highlighted text - such as search results. */

.highlight

{

    background-color: yellow;

    font-weight: bold;

    color: black;

}



/* Alternating backgrounds for posts, and several other sections of the forum. */

.windowbg, .windowbg3

{

    color: white;

    background-color: #000033;

}



/* This is not needed for Firefox....but browsers like Opera and IE follow the attributes inside a table instead of a div.

This here is done to remove the underline on the new posts and no new posts icons. As I personally feel it looks better w/out it. */

.windowbg a:link, .windowbg a:visited, .windowbg2 a:link, .windowbg2 a:visited

{

    text-decoration: none;

}

.windowbg2

{

    color: navy;

    background-color: #fff5ee;

}



/* These are used primarily for titles, but also for headers (the row that says what everything in the table is.) */

.titlebg, tr.titlebg th, tr.titlebg td, .titlebg a:link, .titlebg a:visited

{

    color: #33ccff;

    font-style: normal;

    background-color: #2a2449;



}

.titlebg a:hover

{

    color: red;

}



.titlebg_SE, tr.titlebg_SE th, tr.titlebg_SE td, .titlebg_SE a:link, .titlebg_SE a:visited

{

color: #7A7691;

font-size: 14px;

font-weight: bold;

text-decoration: none;

}



.catbg, .catbg2

{

    font-weight: bold;

    background-color: #38315A;

    color: yellow;

    font-weight: bold;

}



.catbg a:link, .catbg a:visited, .catbg2 a:link, .catbg2 a:visited

{

    text-decoration: none;

    color: yellow;

    font-size: 14px;

    font-weight: bold;

    text-decoration: none;

}



.catbg a:hover, .catbg2 a:hover

{

    color: #757CB0;

}







/* This is used for tables that have a grid/border background color (such as the topic listing.) */

.bordercolor

{

    background-color: black;

}



/* This is used on tables that should just have a border around them. */

.tborder

{

    border: 1px solid #000;

    background-color: #504E79;

}



/* When calling the lighter border color only this can be quite handy. */

.tborder_take2

{

    border: 1px solid #504E79;

}



/* Default font sizes: small (8pt), normal (10pt), and large (14pt). */

.smalltext

{

    font-size: x-small;

And this is another bit of code...

Code Select Expand

.largetext

{

    font-size: normal;}/* This is the white header area where the title, menu bars, and header boxes are. */#headerarea{    background-color: #2B2645;    border-bottom: 5px solid #504E79;    }/* This is the main area of the forum, the part that's gray. */#bodyarea{    background-color: #35304F;}/* And this is the bottom, where the copyright is, etc. */#footerarea{    color: black;    background-color: #2B2645;    border-top: 5px solid #504E79;}/* This is for the special header boxes on the top (user info, key stats, news box.) */.headertitles{    background-color: #3E395E;    color: #7A7691;    border: 1px solid navy;    border-bottom: 0px none black;    height: 12px;    font-weight: bold;          height: 18px; /* This has no effect in IE but is needed to show this right in Firefox */          padding-left: 2px;}.headerbodies{    border-top: 1px solid #635C84;    border: 1px solid #635C84;    background-color: #252238;    background-repeat: repeat-x;    background-position: bottom;    margin-bottom: 4px;    padding: 2px;}/* Posts and personal messages displayed throughout the forum. */.post, .personalmessage{    width: 100%;    overflow: auto;    line-height: 1.3em;}/* All the signatures used in the forum.  If your forum users use Mozilla, Opera, or Safari, you might add max-height here ;). */.signature{    width: 100%;    overflow: auto;    padding-bottom: 3px;    line-height: 1.3em;}/* Posts and personal messages displayed throughout the forum. */.post, .personalmessage{    width: 100%;    overflow: auto;    line-height: 1.3em;}.modbuttons{    background-color: #38315A;    padding: 5px;    color: #be7fc9;    border: 1px solid #504E79;    margin-bottom: 4px;}.modbuttons a:link, .modbuttons a:visited{    color: #be7fc9;    font-size: 13px;    font-weight: bold;    text-decoration: none;}#bodyarea img{ border: 0px solid #ffffff;}body {   letter-spacing:0pt;   cursor: url('http://www.etkiweb.com/Themes/classic/images/cursor1.ani');   background-color=transparent}#wrapper {    margin: 0 auto;    position: relative;    width: 900px;    }#shadow-l {    background: url('images/shadow-l.png') repeat-y 0 0;    padding-left: 6px;    position: relative}#shadow-r {    background: url('images/shadow-r.png') repeat-y 100% 0;    padding-right: 6px;    position: relative}/* IE hack */* html #shadow-l {    float: left;}* html #shadow-r {    float: right;}/* END IE hack *//* This is for the special header boxes on the top (user info, key stats, news box.) */.headertitles{    background-color: #E5F2FF;    border: 1px solid #E5F2FF;}.headerbodies{    border: 1px solid #DEEDFB;    background-color: #EEF7FF;    background-repeat: repeat-x;    background-position: bottom;}/* header */
#header {
    position: relative;    height: 135px;    overflow: hidden;    background: #232833 url('images/header-bg.png') repeat-x;padding-top: 7px
}

#header-l {
    height: 135px;    background: url('images/header-l.png') no-repeat 0 0;    position: relative;    padding-left: 16px
}

#header-r {
    height: 135px;    background: url('images/header-r.png') no-repeat 100% 0;    position: relative;    padding-right: 16px
}


As you can see, it doesn't look quite right. I have also attached the actual CSS file for you to look at if you want to.

Im no expert in CSS and it would be greatly appreciated if someone could fix it for me.

Thankyou in advance for any help that you can give me with this.

I hope that you are all ok 

Take care
God Bless
*midnight*magic*

[IchBin™]

It should still work. Does it not work? While it certainly looks ugly, I didn't see anything that would make it not work.

Code Select Expand

.largetext{
font-size: normal;
}
/* This is the white header area where the title, menu bars, and header boxes are. */
#headerarea{
    background-color: #2B2645;
    border-bottom: 5px solid #504E79;
}
/* This is the main area of the forum, the part that's gray. */
#bodyarea{
    background-color: #35304F;
}
/* And this is the bottom, where the copyright is, etc. */
#footerarea{
    color: black;
    background-color: #2B2645;
    border-top: 5px solid #504E79;
}
/* This is for the special header boxes on the top (user info, key stats, news box.) */
.headertitles{
    background-color: #3E395E;
    color: #7A7691;
    border: 1px solid navy;
    border-bottom: 0px none black;
    height: 12px;
    font-weight: bold;
height: 18px;
/* This has no effect in IE but is needed to show this right in Firefox */   
padding-left: 2px;
}.headerbodies{
    border-top: 1px solid #635C84;
    border: 1px solid #635C84;
    background-color: #252238;
    background-repeat: repeat-x;
    background-position: bottom;
    margin-bottom: 4px;
    padding: 2px;
}
/* Posts and personal messages displayed throughout the forum. */
.post, .personalmessage{
    width: 100%;
    overflow: auto;
    line-height: 1.3em;
}
/* All the signatures used in the forum.  If your forum users use Mozilla, Opera, or Safari, you might add max-height here ;). */
.signature{
    width: 100%;
    overflow: auto;
    padding-bottom: 3px;
    line-height: 1.3em;
}
/* Posts and personal messages displayed throughout the forum. */
.post, .personalmessage{
    width: 100%;
    overflow: auto;
    line-height: 1.3em;
}
.modbuttons{
    background-color: #38315A;
    padding: 5px;
    color: #be7fc9;
    border: 1px solid #504E79;
    margin-bottom: 4px;
}
.modbuttons a:link, .modbuttons a:visited{
    color: #be7fc9;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
}
#bodyarea img{
border: 0px solid #ffffff;
}
body {
   letter-spacing:0pt;
   cursor: url('http://www.etkiweb.com/Themes/classic/images/cursor1.ani');
   background-color=transparent
}
#wrapper {
    margin: 0 auto;
    position: relative;
    width: 900px;
}
#shadow-l {
    background: url('images/shadow-l.png') repeat-y 0 0;
    padding-left: 6px;
    position: relative
}
#shadow-r {
    background: url('images/shadow-r.png') repeat-y 100% 0;
    padding-right: 6px;
    position: relative
}
/* IE hack */
* html #shadow-l {
    float: left;
}
* html #shadow-r {
    float: right;
}
/* END IE hack */
/* This is for the special header boxes on the top (user info, key stats, news box.) */
.headertitles{
    background-color: #E5F2FF;
    border: 1px solid #E5F2FF;
}
.headerbodies{
    border: 1px solid #DEEDFB;
    background-color: #EEF7FF;
    background-repeat: repeat-x;
    background-position: bottom;
}
/* header */
#header {
    position: relative;
    height: 135px;
    overflow: hidden;
    background: #232833 url('images/header-bg.png') repeat-x;padding-top: 7px
}

#header-l {
    height: 135px;
    background: url('images/header-l.png') no-repeat 0 0;
    position: relative;
    padding-left: 16px
}

#header-r {
    height: 135px;
    background: url('images/header-r.png') no-repeat 100% 0;
    position: relative;
    padding-right: 16px
}

[*midnight*magic*]

Hiya,

Thankyou ever so much for fixing that bit of code for me. I really do appreciate it 

I will be putting my forums up by the end of this month ( hopefully ) so I will let you know how it goes.

Thanks again.

Take care
God Bless
*midnight*magic*