Alignment of Home Page Footer Boxes Outreach Theme

[Janet]

I am working on a client's website here: http://www.jdstatepark.com/

I would like for the images to sit on the bottom of the widget evenly when viewing from a desktop. Right now they are not all even on the bottom as seen here. I've tried several things but am not able to get it to work.
https://www.dropbox.com/s/z15n84yksyaf5ft/jd-bottom-boxes.png

I would also like for them to be lined up centered like the text is when viewing on a tablet. When viewing on an iPhone, it is centered properly. Here is how I'm seeing it.
https://www.dropbox.com/s/i2235masu9mnf7j/jd-bottom-boxes-horizontal.png

Thanks so much!

Janet

http://www.jdstatepark.com/

[Tom]

Janet,

I see that you're working around the problem by consistently using longer titles so that the text always wraps to two lines.

If you want to avoid that, you can add a small change to the styling of the H4 title text for those widgets:

.footer-widgets .widget-title { min-height: 36px !important; }

(i.e. twice the font size)

For the image alignment in the footer add this code to the bottom of your style.css file. It may also help to set image alignment to 'none' in the featured page widget.

.footer-widgets .widget-wrap a {
    margin: 0 auto;
    display: block;
}

.footer-widgets .widget-area img {
    margin: 0px auto;
    display: block;
}

.footer-widgets .widget-area p {
    max-width: 350px;
    margin: 0 auto;
    text-align: center; 
}

.footer-widgets .widget-area .more-link {
    display: inline;
}

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[Janet]

Thank you, Tom! This worked perfectly.:)

[Author]

Posts