Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved Boxes Background Colour

Question

Posted · Report post

Hi Guys

I'm just starting on a new sites which you can see here - http://acaibeads.com.au/ password = "acai"

Im wanting to add a semi transparent background color to each individual box, then center the text and photo in each box.

I'm usually ok at identifying the elements I want to apply CSS to with Chrome developer tools, but I'm having trouble with this.

I've tried -

div.grid-element.pp4.img_grid {background: rgba(255,255,255,0.7);

}

and a few other variations with no success

Also none of the other solutions mentioned on the forum worked for me

One other workflow question - when you are inspecting a page with Chrome dev tools (for those who use it) is there away to select a element and copy the name so it can then be directly pasted into ones stylesheet? Or is this the reason firefox is so popular

Any help would be much appreciated

Thanks

WT

Share this post


Link to post
Share on other sites

6 answers to this question

Posted · Report post

Hi,

Add this to your custom CSS and this will centre align your image and give each box a transparent background:


#site .fbox {
background: rgba(250, 250, 250, 0.5);
text-align: center;
}

#site .fboxgraphic {
margin: 15px auto;
}[/CODE]

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks for your response Danny,

I've tried that and it doesn't work?

Any other suggestions?

Thanks

Tom

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Tom try the three pieces of code below.


.fboxtitle h3 {

    text-align: center;

}


.top_thumbs .fboxgraphic, .only_thumbs .fboxgraphic {

    margin: auto;

}


.blocks {

    background: none repeat scroll 0 0 rgba(91, 91, 91, 0.27); }


Share this post


Link to post
Share on other sites

Posted · Report post

Actually - I realised i had a problem with my stylesheet and Danny's code did work.

Thanks Very Much!

Share this post


Link to post
Share on other sites

Posted · Report post

Excellent, glad it worked

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites