The Category widget: How do I get the categories to be stacked and not 2×2?
-
Does anyone know what code I need for the CSS editor to have the categories in the sidebar show as 1-per line (stacked) instead of 2 per line, as it currently is?
My site is Theleader.ca using the Hive template.
Thanks
C.The blog I need help with is: (visible only to logged in users)
-
This should do it:
.widget_categories > ul > li { display: block; width: 100%; }More about the display property: http://htmldog.com/reference/cssproperties/display/
-
Wooohooo! It worked:) I also was able to bold the categories, but I can’t seem to be able to I bold (or change the colour) of the widget title only – could you help me with that as well? Mine is called “What Else?”
Merci:)
C. -
You can make the Categories widget title bold like this:
#categories-4 .widget-title { font-weight: bold; } -
Thanks! I’ve made some progress! Although I can’t seem to be able to change the colour of the categories even though I can change the font size. Any suggestions?
An what about chaining the font colour of the site header and tag line in the masthead, and the primary menu names listed right below – is that doable?
C.
-
Oh, and maybe this as well – I wanted to add the word “magazine” underneath “The Leader” header, but in smaller caps and not part of the tag line below – is that also doable?
Thanks so much for your help!
C. -
Hi there!
I spent time on this this morning and figure it all out exempt the last question, about inserting the world “magazine” between the masthead header and tagline. Let me know if you have any suggestions for that!
Appreciate your help!
C. -
Glad you figured out most of the CSS you needed!
I wanted to add the word “magazine” underneath “The Leader” header, but in smaller caps and not part of the tag line below
You could “fake” this with something like:
.site-title::after { content: "Magazine"; font-size: 30%; display: block; letter-spacing: 2px; }You can adjust the size and letter spacing as you like. Let me know if that does the trick!
-
Sneaky, I like it and it worked:)
Ok, so now I’m having trouble figuring out how to make changes to the “Related” and “Comments” sections as well as the “Older posts” box at the bottom of the article pages. I’d like to change the text colour and background of the boxes. What do you suggest?
Also, would you mind giving me some general CSS-tips …I know where to find the code using the Inspect Elements function, but then I’m never sure if I need to use the div, class, both, or more! I end up trying every iteration until I see a change:( Some basics would help me not pull my hair out (no going bald on this project!) and navigate small changes on my own:) Let me know!
Merci:)
C. -
Also, would you mind giving me some general CSS-tips …I know where to find the code using the Inspect Elements function, but then I’m never sure if I need to use the div, class, both, or more! I end up trying every iteration until I see a change:( Some basics would help me not pull my hair out (no going bald on this project!) and navigate small changes on my own:) Let me know!
Sure! It can definitely sometimes be challenging finding the right selector to target. A key tool is a browser inspector, like the ones built into Firefox and Chrome, or the Firebug extension for Firefox. Here are some guides on finding the right selectors to target with CSS. Why don’t you give them a read and try to make some of the additional changes you’re after. If you still need help after that, could you please start a new thread and someone will be happy to help you out.
http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/
https://thewc.co/articles/view/web-inspector-tutorial
This is a CSS resource I put together with a colleague that has some sections about selectors and browser inspectors, with more resources near the end:
https://cssworkshop.wordpress.com/
Good luck!
- The topic ‘The Category widget: How do I get the categories to be stacked and not 2×2?’ is closed to new replies.
WordPress.com Forums 