Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • November 29, 2014 at 12:58 pm #360059
    youtea

    Hi.
    I’d like to have a post slider displaying latest posts but want the image to be full width while the title stays in line within the content margins. So the title alignment stay the same.

    I’ve tried putting it within a color-section and adjusting via css but it’s not responsive and crops off the right side.

    Any ideas?
    Thanks

    November 30, 2014 at 10:37 pm #360433
    Josue

    Hi!

    I think it would be better to use LayerSlider in this case. You can put dynamic content in layers – http://screencast.com/t/lGzTC7wuAxW

    Regards,
    Josue

    November 30, 2014 at 11:50 pm #360470
    youtea

    HI, thanks for the response.

    I think that seems to be quite a complicated and uneccessary way to achieve what I’m trying. All I’d like is the image that comes with the post, to be displayed full-width, or even just wider than the content margins. Is there no way to Quick CSS the image element?
    Hope there’s a solution.
    Thanks.

    • This reply was modified 9 years, 4 months ago by youtea.
    November 30, 2014 at 11:57 pm #360476
    Josue

    Hey!

    You can force a container section to be full width with CSS, try setting a custom ID to that section and add this to Quick CSS:

    #full-width-section .container {
    width: 100%;
    max-width: 100%;
    padding: 0;
}
#full-width-section .wp-post-image {
    width: 100%;
}

    Regards,
    Josue

    December 1, 2014 at 1:32 am #360502
    youtea

    That code doesn’t make a difference.

    I added a custom ID “home_slider”and tried both
    ————————————————
    #home_slider .container{
    width: 100%;
    max-width: 100%;
    padding: 0;
    }

    #home_slider .wp-post-image {
    width: 100%;
    }
    ————————————————
    and
    ————————————————
    .home_slider .container{
    width: 100%;
    max-width: 100%;
    padding: 0;
    }

    .home_slider .wp-post-image {
    width: 100%;
    }
    ————————————————

    December 1, 2014 at 2:41 am #360528
    Josue

    You need to put it inside of a Color Section and set the identifier (class or ID) to the Color Section, not to the element.

    December 1, 2014 at 3:27 am #360545
    youtea

    Ok that’s working for the whole post slider. But is there a way to make just the post image full width and the post title and excerpt stay in line with the site content?
    Thanks

    December 1, 2014 at 4:08 am #360564
    Josue

    Change your slide caption CSS code to this:

    #top .home_slider3 .entry-content-header, #top .home_slider3 .slide-meta, #top .home_slider3 .slide-entry-excerpt {
	color:#ffffff;
	background-color:#0084b2;
	max-width: 380px;
	padding: 0 20px;
}
#top .home_slider3 .entry-content-header{
	padding-top: 20px;
}
#top .home_slider3 .slide-entry-excerpt{
	padding-bottom: 20px;
}
#top .home_slider3 .slide-content{
	position:relative;
	width: 910px;
	float: none;
	margin: -100px auto 0 auto;
}

    Best regards,
    Josue

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.