Shape 5

Hi
I installed S5 Photo Showcase for to replace the HTML module in home page, in top_row1_1 position. My problem is with mobile view. The module shows good the images and the text in desktop, but it shows the texts too big and high on the ipad and iphone, until they disappear from the picture frame. I think this must be something with css style, but I have the configuration's module in ""Plain text - Module adds styling" for to set my css style because when I set  "HTML - I will provide the styling" nothing shows. Please I need your help. The site is http://www.primusasesores.cl/

Hello,

I don't see the photo showcase module published to your site. Please post a url to where the module is published.

The module is the first slideshow in home page: http://www.primusasesores.cl/index.php

Hello,

You have a class on your text that has a very large margin on the bottom:

.slideshow_tit {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #ffffff;
    font-size: 1em;
    font-weight: 600;
    line-height: 135%;
    margin-bottom: 153px;
    text-align: center;
}

That margin-bottom is almost as tall as the module itself on mobile screens so it's pushing it out of view.

I don't recognize this css, is this something you added? We don't provide support on custom css. If you're trying to align the text in the center there are several methods given here:

http://www.w3.org/Style/Examples/007/center.en.html

Thanks, I have reviewed the css you indicate me and I corrected some errors with width and height.
That was one of many attempts to find the css to fit the text.
I modified the style also compared with the style html css demo video module on the homepage.
I used the style demo "video_overlay_text_wrap_inner" for the div, but not the style for text h2, behold used its own style.

.video_overlay_text_wrap_inner {
    margin: 0;
    position: absolute;
    top: 0%;
    transform: translate (0px, -50%);
    -ms-transform: translate (0px, -50%);
    -webkit-transform: translate (0px, -20%);
    text-align: center;
    max-width: 80%;
    Color: #FFFFFF;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}


I do not know how to make the text is responsive and call certain styles in s5.responsive.css as "media screen and (max-width: 579px)."
I need that texts more smaller in view of the iphone.
One thing strikes me: In the demo slideshow S5 Photo Showcase, the texts do not fit, they disappear, please look at: http://www.shape5.com/demo/photobox/index.php/extensions/s5 -Photo-showcase
Does the slideshow has a disability with texts ?.
I need texts look smaller in the slideshow at the phones.
Furthermore, in normal view slideshow I need texts more above. I can not set it better because it deconfigure view in iphone.
Thanks, I hope your help!

Hello,

The text was stylized to disappear on the Photobox template for mobile, but that's specific to that template.

We don't provide support for customizing the look of the module. If you just want to reduce the font size you can do something like this:

@media screen and (max-width: 970px){
#s5_photo_showcase_conent_wrap_inner2 {
font-size:0.7em;
}
}

You can add that to custom.css. Just make sure you are using "em" font-sizes on your content.

Yes, I'm using "em" font size.
How can I disable  the text for to show in devices? I don't want to have more problems.
Thanks!

Hello,

You can use a display:none call for the ID of the text that you want to remove within your own set media query width.

@media screen and (max-width: 970px){
#s5_photo_showcase_conent_wrap_inner2 {
display:none;
}
}

O.K! Thanks you very much!