Posted 1 year ago #
Hi!
I'm trying to change the style of two out of four of the text boxes on my site.
My html/php skills are quite meagre, but I have friends who can help if anyone can point me in the right direction.
I want to center the title, and also change the colour of the text and box background. I can change them all, but I can't separate them.
If there were two text-box widgets, it'd be easy, but I'm not sure how to define them separately.
Ryan
with a link to your site, this would be esasier to answer.
check if the textwidgets have individual css classes or ids to select them with (that might depend on your theme);
they might also be in different divs or sidebars which you cold use in the css styles.
Posted 1 year ago #
Opps sorry, this is my first post, and I literally read that in the rules 30 seconds ago.
http://www.flissycakes.com/wp
It is the top two boxes I want to change.
luckily the textwidgets have these css ids;
the top one has the css id #text-4
and the next one down has the css id #text-5
you can add styles like the following to style.css of your theme:
#text-4 h3 { text-align:center; }
#text-4 p, #text-4 a { color: #123456; }
#text-5 h3 { text-align:center; }
#text-5 p, #text-5 a { color: #123456; }
Posted 1 year ago #
Oh, how simple. Thanks very much for your help.
The other things I wanted to edit in the text box are the boarder colour, the background colour and the title text colour.
My friend who is teaching me html always refuses to help me unless I've tried first, so out of respect for your help, I'm going to apply the same principle. This is what I've tried, but its not working:
#text-4 { background-colour: #9cccc6; }
#text-4 widget-title { colour: #FFFFFF; }(I'm not sure what I need for the outline boarder colour) :-(
the spelling is color
here is a link to an useful tutorial (imho).
http://www.w3schools.com/css/
Posted 1 year ago #
Oh, how silly of me - stupid American spelling.
Anyway, it's not entirely my fault, I've tried:
#text-4 { background-color: #9cccc6; }
#text-4 widget-title { color: #FFFFFF; }and
#text-4 background { color: #9cccc6; }
#text-4 widget-title { color: #FFFFFF; }but neither are working.
Did you forget the link?
added the lihnk ;-)]
the widget backgrounds use background images;
therefore, just defining a new background-color is still overwroitten by the existing background image style:
try
#text-4 { background: #9cccc6; }
#text-4 .widget-title { color: #FFFFFF; }there needs to be a dot . before widget-title to indicate that it is a css class.
Posted 1 year ago #
Perfect!
Got it exactly how I want it.
Thanks so much for your help.
This topic has been closed to new replies.
