Changing the size of Featured Slider on Twenty-fourteen theme

wisem2se · Member · Jan 14, 2014 at 10:08 pm
Copy link

Add topic to favorites
I need to change the size of the images appearing on my slider.
It’s for the Twenty-fourteen theme.
The images now are so large I have to scroll down on my homepage to see the title of the article.

I’m very new to CSS Customization so please be patient. :)

Any help would be greatly appreciated! Thank you!

The blog I need help with is: (visible only to logged in users)
justpi · Member · Jan 15, 2014 at 1:29 am
Copy link
The slider crops your images anyway, so you mean you want to change the height of the slider itself.
Try adding this, and change the 400 to adjust:
```
@media screen and (min-width: 673px) {
.slider .featured-content .hentry {
height: 400px;
}
}
```
wisem2se · Member · Jan 15, 2014 at 2:55 pm
Copy link
That got me half way there!

That adjustment left a background color where the height of the image was removed. In other words, the scroll arrows and bottom of the slider are in the same place.

Any further suggestions?
thesacredpath · Member · Jan 15, 2014 at 6:44 pm
Copy link
Hi @wisem2se, give the following a try, which adds another selector to what @justpi gave above. It seems to work for me and moves the arrows up and gets rid of the additional grey that was appearing.
```
@media screen and (min-width: 673px) {
.slider .featured-content .hentry, .featured-content {
height: 400px;
}
}
```
wisem2se · Member · Jan 15, 2014 at 6:47 pm
Copy link
It worked! Thank you so much. You guys are awesome!
thesacredpath · Member · Jan 15, 2014 at 6:49 pm
Copy link
You are welcome!
justpi · Member · Jan 15, 2014 at 8:29 pm
Copy link
You’re welcome from me too, and sorry I didn’t foresee this: I worked the solution in my test blog, didn’t get the side effect you got, and didn’t think of trying the solution on your blog before suggesting it.

No items found.