Text overlay

haonas

Hello i'm using NSP standard mode and i'm looking for a way to show the information block on top the thumbnail. I tried some custom css but things get weird because the thumbnail is responsive and the text overlay is not.
Is there an easy way to show the info block on top of the thumbnail and both to have responsive behaviour?
Kind Regards

Ninja

haonas
Hi
Kindly share the page URL on which module published and screenshot of your request so I can check it.

haonas

Thank you for the fast reply
Here is the url https://bit.ly/2Qs3hww
All the module blocks serving content except the slider are NSP blocks.
As you can see i have the information block for showing the created date overlayed on the thumbnail but if you resize the browser size the information block is moving away from it's position.

Ninja

haonas
Hi
Kindly post illustrated screenshot how you want to show it and turn off the compression from site.

haonas

This is what i want, the info block being on bottom left of the thumbnail and as i said earlier i managed to achieve this with custom css

And this is the issue that occures on different screen size because the info block is not responsive

I also disabled compression as you asked me.
I hope that helps

Ninja

haonas
Hi
The block is responsive to make it you have to make different custom style for different screen size via media queries.
Example to apply code for mobile view use this code

@media(max-width:468px){.nspHeader{font-size:12px;}}

haonas

Thanks for your help.
My issue is not the font size but that the information block is moving away from the position that i want it eg bottom left

Ninja

haonas
Hi. The above code is an example how to make different media query so you can change apply your custom style for different screen sizes to create responsive style.