PDA

View Full Version : Changing category and section backgrounds


ProfC
07-24-2015, 11:56 AM
Hi folks,

A few users on my board have suggested that we change the "backgrounds" of certain sections/categories to make them more indicative of what their purpose is. I'm not 100% on how to achieve this.

I was thinking that it could be possible via CSS and <div> tags, but I'm not particularly experienced in that area.

Using the additional.css file, and some old knowledge, I've had a go on a category as a test but for some reason, the container isn't expanding to cover the entire area and it looks really scrunched up (http://gyazo.com/dc0fe4c085d271fdba4db888f95052af). (Please ignore the colour of the text)

Would it be possible for someone to tell me what I'm doing wrong?

Thank you in advance :)

In the forum description:
<class id="alexandria_castle";></class>

In additional.css
#alexandria_castle
{
background-image:url("http://i.imgur.com/F52Yu1U.jpg");
background-repeat: no-repeat;
background-size: cover;
height: 250px;
width: 400px;
color: #FCFC38;
border: 1px outset #CD7F32;
padding: 1px;
border-radius: 2px;
}

Fields
07-24-2015, 01:18 PM
You could try to add the following to your CSS:

display: block;

Maybe this helps :)

ProfC
07-24-2015, 01:45 PM
Thank you, that's definitely helped.

What do I need to edit in order for this to cover the entirety of the title section? I've
put <class id="alexandria_castle";>Alexandria Castle</class>as the title but it only covers part of the way (http://gyazo.com/2486e30737c9745120159b98eac33310). There's a part of my brain telling me it's .forumhead, but if so, how would I get it to edit just that one forum?

Fields
07-24-2015, 02:42 PM
Try the following:

Add
position: absolute;
z-index: -1;

to your CSS, and see if that works for you :)

ProfC
07-24-2015, 03:47 PM
It does, although it also goes off to the side of the page until the end of it. I'm sensing there could be an issue with the stack order of its parent, as it's also off colour and unclickable. If I add the same class into the description to check, the description of the board itself is invisible beneath it.

napy8gen
07-27-2015, 12:17 PM
revert all what you have been doing especially templates(maybe this one forumhome_forumbit_level1_nopost) in the forumhome templates.

try this css in additional.css

#cat6 .forumhead{background:red none;}

change the number "6" to the number of your category to test out. To see what your category id number. Go to to your forum & moderators> forum manager>

ProfC
07-31-2015, 10:02 AM
revert all what you have been doing especially templates(maybe this one forumhome_forumbit_level1_nopost) in the forumhome templates.

try this css in additional.css



change the number "6" to the number of your category to test out. To see what your category id number. Go to to your forum & moderators> forum manager>

Thank you! :D