CSS for fixed width and background image

Go down

CSS for fixed width and background image

Post by TerryAhn on September 18th 2010, 8:09 am

Hey guys, I need some help with CSS, as I'm not very familiar with CSS language.

First off, this is my forum

www.lolaustralia.com

and here is the CSS for it.



Spoiler:
a:link,a:active,a:visited,a.postlink{
color: #D0A700;
text-decoration: none;
font: bold;
}

a:hover{
color: #767676;
font: bold;
}

a.admin:hover,a.mod:hover{
color: #767676;
}

a.but,a.but:hover,a.but:visited{
color: #D0A700;
text-decoration: none;
}

a.cattitle,a.cattitle:visited{
color: #767676;
text-transform: uppercase;
font: bold;
}

a.cattitle:hover{
color: #D0A700;
text-transform: uppercase;
font: bold;
}

a.topictitle:visited{
color: #B28F00;
}

a.topictitle:hover{
color: #767676;
}

body{
background-color: ;
color: #E7E7E7;
font: 12px Verdana,Arial,Helvetica,sans-serif,Trebuchet MS;
margin: 20px;
padding: 3;
scrollbar-3dlight-color: #6A6A6A;
scrollbar-arrow-color: #EEEEEE;
scrollbar-darkshadow-color: #000000;
scrollbar-face-color: #1F1F1F;
scrollbar-highlight-color: #1F1F1F;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #4D4D4D;
background-image: url(http://i25.servimg.com/u/f25/15/15/01/68/summon12.jpg);
background-attachment: fixed;
background-repeat: no-repeat

}

font,th,td,p{
font-family: Geneva, Arial, Helvetica, sans-serif,Trebuchet MS;
font-size: 12px;
}

form{
display: inline;
}

hr{
border: 1px solid #000000;
border-top-width: 1px;
height: 0px;
}

img{
border: 0 solid;
}

input{
color: #E7E7E7;
font: 12px Verdana,Arial,Helvetica,sans-serif,Trebuchet MS;
}

input.button,input.liteoption,.fakebut{
background: #303030;
border: 1px solid;
border-color: #707070 #000000 #000000 #707070;
color: #E7E7E7;
font-size: 12px;
}

input.catbutton{
background: #303030;
border: 1px solid;
border-color: #707070 #000000 #000000 #707070;
font-size: 11px;
}

input.mainoption{
background: #303030;
border: 1px solid;
border-color: #707070 #000000 #000000 #707070;
color: #FFCC00;
font-size: 11px;
}

input.post,textarea.post{
background: #303030;
border: 1px solid;
border-color: #000000 #707070 #707070 #000000;
color: #E7E7E7;
font: 11px Verdana,Arial,Helvetica,sans-serif,Trebuchet MS;
padding-bottom: 2px;
padding-left: 2px;
}

p{
margin-bottom: 3px;
margin-top: 2px;
}

select{
background: #303030;
color: #E7E7E7;
font: 11px Verdana,Arial,Helvetica,sans-serif,,Trebuchet MS;
}

td.cathead{
background: url(https://2img.net/h/i854.photobucket.com/albums/ab107/Ghaanlola/categorymainparchment-2.png);
color: #8E8E8E;
font-weight: bold;
height: 28px;
letter-spacing: 1px;
text-indent: 4px;


}

td.genmed,.genmed{
font-size: 11px;
}

td.rowpic{
background: url(https://2img.net/h/i854.photobucket.com/albums/ab107/Ghaanlola/categorymainparchment-2.png) #343434 repeat-y;
}

td.spacerow{
background: url(https://2img.net/h/i854.photobucket.com/albums/ab107/Ghaanlola/categorymainparchment-2.png) #222222 repeat-x;
}

th{
background: url(https://2img.net/h/i854.photobucket.com/albums/ab107/Ghaanlola/categorymainparchment-2.png) #171717;
color: #8E8E8E;
font-size: 12px;
font-weight: bold;
height: 27px;
width: 1280p;
padding-left: 8px;
padding-right: 8px;
text-align: center;
white-space: nowrap;

}

.admin,.mod{
font-size: 12px;
font-weight: bold;
}

.admin,a.admin,a.admin:visited{
color: #FFA34F;
}

.bodyline{
background-color: transparent;




}

.bodyline{

border: 0px solid ;
padding: 20;
border-color:#129CA6;
width: 1280px;

}


.forumline{
border: 1px solid;
font-size: 12px;
border-color: #000000 #707070 #707070 #000000 ;
}
.code{
background: #525252;
border: 1px solid #000000;
color: #FFFFB3;
font-size: 12px;
line-height: 125%;
width: 1280p;
}

.errorline{
background: #2D2D2D;
border: 1px solid #5A5A5A;
}

.explaintitle{
color: #727272;
font-size: 12px;
font-weight: bold;
}

.forumline{
background: #010101;
}

.gensmall{
font-size: 10px;
}

Unfortunately my background and forum is not a fixed width so people with high resolution monitors would see that the background (the purple building image) is fixed to top left and does not stretch. How would I make it so its fixed to the center and stretches for people with higher monitors?

Also, the more important issue is I would like a fixed width for my forum part, because sometimes it stretches horizontally when a large image is posted.

If possible, can someone put in the css code thats needed for both into my current CSS and post it so I can copy and paste? I am even unsure of where to put the codes in the css.


Last edited by TerryAhn on September 21st 2010, 5:13 pm; edited 1 time in total

TerryAhn
Forumember

Posts : 49
Reputation : 0
Language : english

Back to top Go down

Re: CSS for fixed width and background image

Post by TerryAhn on September 18th 2010, 5:02 pm

Noone knows how?

TerryAhn
Forumember

Posts : 49
Reputation : 0
Language : english

Back to top Go down

Re: CSS for fixed width and background image

Post by TerryAhn on September 21st 2010, 5:11 pm

Bump, a prime example for my forum width problem would be when you go to the FAQ and click one of the questions that has a long answer, the width would increase to match that answer. I would like it so it doesnt move and its a fixed width.

TerryAhn
Forumember

Posts : 49
Reputation : 0
Language : english

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum