Site logo

Archived topic

CSS making me crazy

8 replies · Started by John on December 15, 2017

Viewing posts 1–9 of 9

https://h2only.ca/renew/

Messing with the footer widgets. Cannot get the background colour (the violet) to line up with the title box... the left side hangs out 40px. Yes... 40px. I found the declaration:

class="inside-footer-widgets"

with value

.site-footer .footer-widgets-container .inside-footer-widgets {margin-left: -40px;}

but why can I not adjust it?

BTW: by adjust it, I mean, for instance, this dec in my child css file:

.site-footer .footer-widgets-container .inside-footer-widgets {margin: 0 5px 0 5px;}

Which I have no doubt is not correct, but I'm not seeing any reaction to putting it in.

nvr mind. I guess yesterday's work with Jon Mather didn't pan out after all. It seems cloudflare still messes me up.

But while I have your attention: how can I get a gap between those widgets on +769 width?

nvr mind v.2. In my ongoing efforts, I've made it worse, rather than better. Losing the plot a bit here... now on large screen I don't get them side-by-side.

Why do I do this, again?

Instead of applying your CSS to .footer-widget-1 etc.. apply it to the inner container: .footer-widget-1 .widget

Then add this CSS:

.site-footer .footer-widgets-container .inner-padding {
    margin: 0 0 0 40px;
    padding-left: 0;
}

Thanks, Tom. That got me half-way there. The left widget box now lines up as expected. The right one, however, remains unresolved.

Doofus CSS question: when we write
.site-footer .footer-widgets-container .inner-padding {
is that then to a particular location, or does it affect each class? IOW: is it telling 'inner-padding' at 'footer-widgets-container' at 'site-footer' to do something, or is it telling each of those? I am assuming the former, as, of course, I can set '.mycontainer h1 {blah} and it only affects that instance, and not all h1's.

And, I will re-ask the question I asked in the other thread: am I requiring too much support? If so, please tell me.

Sorry. I lied above. Missed adding one .widget. Perfect! Nice wide gutter and everything!

All good now? :)

Yep. Until I wreck something else, at least. I need to implement a version control system, I think ;)

And learned something: I didn't know about .class1 .class2 .class3 { } syntax. I knew about .class1 h1, etc, so it isn't like this is the heavens opening, but it is something new to me. Macro vs micro .classes: Interesting.

This archived topic is closed to new replies.