HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


Box background colour override

Login / Search

 [ Join | More ]
 Add topic 
Posted
Item has a rating of 5 (Liked by KingBast)  
Rating:
#110132 (In Topic #21896)
TQ
Avatar

Honoured member

Hi All,

I use

Code

[box]My content[/box]
quite frequently on my site. There are rare occasions when I'd like to emphasise the content of the box so it would be helpful if I could invert the colour scheme (I run a dark site).

Is there a simple way of setting/overriding the box background colour?

Tnx

TQ
Back to the top
 
Posted
Rating:
#110134
Avatar

Hi,

Yes.

The best way to do this is as follows…

Code

[surround="emphasised_box"]
[box]My content[/box]​
[/surround]

and in your CSS…

Code

.emphasised_box .box {
   background-color: red;
   background-image: none;
}

Something like that anyway.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#110138
TQ
Avatar

Honoured member

Chris Graham said

Hi,

Yes.

The best way to do this is as follows…

Code

[surround="emphasised_box"]
[box]My content[/box]​
[/surround]

and in your CSS…

Code

.emphasised_box .box {
   background-color: red;
   background-image: none;
}

Something like that anyway.

Brilliant!

Thank you Chris.

And by the way, I so love how editing the CSS updates the site on the fly. This and a bunch of other features like meaningful php error messages are really helping me to learn.

Thank you.

TQ
Back to the top
 
There are too many online users to list.
Control functions:

Quick reply   Contract

Your name:
Your message: