Daily Dish Pro footer alignment issue

[kwidrick]

Help, please! I just finished customizing a client's site (http://aladygoeswest.com) on the Daily Dish Pro theme and for some reason, the footer widget title bars are out of alignment (the padding/space between the left and center footer titles is different than between the center and right).

I don't know when this happened, so I don't know what step of my process screwed it up and unfortunately, everything I've tried has failed. I tried putting only text widgets in each three just to see if it was a padding/CSS issue with a specific plugin I was trying to put into the widget, and the same alignment issue happened.

Thanks for any suggestions! A screenshot is here.

http://aladygoeswest.com/

[Pixel Frau]

The padding you added to .footer-widgets is causing it. Either remove that padding or reduce the margin-right for .footer-widgets-1 to 40px.

[kwidrick]

Thanks so much and I'm sorry to still be confused.

I just looked at the section you talked about and I don't see the padding issue (see the current code pasted below; I also compared it to the theme file's original, unedited stylesheet, and it matches).

Also, my settings via Genesis Design Palette Pro are set according to the screenshot here: (https://flic.kr/p/zQjbh8) and adjusting them doesn't seem to fix the problem either (I can move the title bars around but it affects all of them -- not just the padding between the first and second widget).

/*
Footer Widgets
---------------------------------------------------------------------------------------------------- */

.footer-widgets {
border-top: double #ddd;
clear: both;
padding: 40px 0 20px;
}

.footer-widgets li {
border-bottom: 1px dotted #ddd;
margin-bottom: 10px;
padding-bottom: 10px;
}

.footer-widgets-1,
.footer-widgets-2,
.footer-widgets-3 {
width: 320px;
}

.footer-widgets-1 {
margin-right: 60px;
}

.footer-widgets-1,
.footer-widgets-2 {
float: left;
}

.footer-widgets-3 {
float: right;
}

[Pixel Frau]

This is from the original Daily Dish CSS:

.footer-widgets {
border-top: double #ddd;
clear: both;
padding: 40px 0 20px;
}

This is what I see when inspecting your site's CSS:

body.gppro-custom .footer-widgets {
background-color: #eee;
border-width: 0;
padding-left: 20px;
padding-right: 20px;
padding-top: 20px
}

The left and right padding is causing the issue. It looks like it was added via a plugin.

To solve the problem, either remove that left and right padding from .footer-widgets or reduce the margin-right to 40px for .footer-widgets-1.

[Author]

Posts