Thumb Image on Right – Block 11, 1 Column

Posted in: Newspaper
Post count: 45
temporary_saint
#149052
Dec 19, 2016 at 11:39 pm

Hello – I’ve tried to adjust the css to get the 1-column version of Block 11 to show the image on the right but I can’t seem to get it to override the existing CSS, even using !important.

http://demo.tagdiv.com/newspaper/block-11/

Any help would be appreciated!

Cheers!

Post count: 20685
Simion C.
#149120
Dec 20, 2016 at 1:00 pm

Hi,

Enter this code in the Theme panel->Custom Css

.td-pb-span4 .td_block_11 .td_module_10 .td-module-thumb {
right: 0;
left: auto;
}
.td-pb-span4 .td_block_11 .td_module_10 .entry-title {
padding-right: 95px;
padding-left: 0;
}

Thanks

Post count: 45
temporary_saint
#149209
Dec 20, 2016 at 6:27 pm

100% – thank you sir! 🙂

Post count: 45
temporary_saint
#149485
Dec 21, 2016 at 11:14 pm

This works perfect on desktop but the title runs beneath the photo on iPhone landscape mode (when the thumbnail image jumps up to 150px in width).

How do I handle the screen size between iPhone portrait and iPhone landscape so that I get the proper right padding?

I’m also how would I turn on the excerpt for mobile sizes (below 768) for this block?
Thx!!

Post count: 20685
Simion C.
#149567
Dec 22, 2016 at 11:49 am

Hi,

Enter this code in addition to the one provided above, in the same Custom Css

@media (max-width: 767px) and (min-width: 500px) {
.td-pb-span4 .td_block_11 .td_module_10 .item-details {
padding-left: 0;
padding-right: 95px;
}
}
@media (max-width: 767px) { .td-pb-span4 .td_block_11 .td_module_10 .td-excerpt {
display: block;
margin-top: 20px;
}
}

Let me know if this works

Thanks

Post count: 45
temporary_saint
#149636
Dec 22, 2016 at 4:52 pm

Looks great! Thank you!

Viewing 6 posts - 1 through 6 (of 6 total)
You must be logged in to reply to this topic.