I am having problems with the responsive slider on the agency theme. I wanted to get the slider to look exactly like the agency demo does. With the excepts perfectly displayed on the right and the continue reading button below the excerpt; however, for some reason mine will not display the same way. My continue reading button gets distorted and is placed too high up. Also, the excerpts white background only covers 3 quarters of the image. Anyone know a solution for this?

To fix the white box not completely filling the slider I found two solutions…

#1- the easier solution is to just put more text. Like Andrea Rennick posted, just move your “more” tag a little further down the page or add more text above it.

#2 – The CSS fix is to add a “bottom: 0;” ( <- that’s a zero ) to the .slide-excerpt styling. There are three places you can do this. Either the style.css for the slider plugin, the style.css for the theme, or put it inline somewhere on your page. There is already some inline CSS in the header of the page output, but I didn’t dig far enough to see if it was the plugin or theme that was outputting it. There is an entry there for “top: 0;” which made me realize it must be positioned (absolute or relative, not sure), and to put “bottom: 0;” to the selector as well to make it fill the whole slider.

.agency .slide-excerpt { bottom: 0; }

To fix the continue button is a little more complex. The <A> tag is just put at the end of the text without any sort of break above it. Putting it outside the <p> tag above it would probably be the best, but even a <br> would be helpful. That is in the functions somewhere (of the plugin I believe) and I didn’t want to edit it in case of a future update would overwrite it. If you put a “display: inline-block;” or “display: block;” to the selector “#home-slider a.more-link” it will fix the spacing issue.

If you use block, the tag will automagically fall below the text, but it will fill the entire width of the white box. That may or may not be something you want.

If you use inline-block, the spacing around the tag will be fixed, but it will only fall to the next line *if* there is not enough room on the line it’s on. (I hope that makes sense). Since it’s a big element, it usually falls to it’s own line. But if it doesn’t you will have to edit your excerpt creatively to make it wrap to the next line. I think block is better for this reason.

Alternatively you could probably float it or position absolutely, but I didn’t try this.

#home-slider a.more-link { display: block; }

There may be side effects to these tweaks, but I haven’t seen any yet [crosses fingers]