Issues with responsive layouts

Digitalcap's picture
Digitalcap
Tue, 07/18/2017 - 03:59
#1
Issues with responsive layouts

Hello,

I am building a website and used MDslider on homepage and other sub pages. I am facing issue with the responsive layout. When I am viewing website in small screen below 1366 width.

Please have a look to screenshot I have added: 

https://gyazo.com/516868ac4a86a57b3a9070173cc54d59

https://gyazo.com/03ea35ac46ba80044d0bc593b76ff907

https://gyazo.com/8bcb20f5c4630cf5a3669846db73e9f9

Website URL: http://www.massage.ossquad.com/

.htaccess sevurity user / password: ***/  **@**

Admin panel user / password:  **/   **@**

I have sliders on following pages:
Home  |  Available Now   |  All Listings  |  Massage Types

Other question:

If i am adding a fix height to 350px, but it is displaying different height on different screen size. I want height fixed to 350px for all screen except mobile and tablets or ipad. Is it possible? what should I do to get it fixed to 350px?

phuonght's picture
phuonght
Tue, 07/18/2017 - 04:18

Hi,

Please do not public site account in post. You can send it by private comment. 

phuonght's picture
phuonght
Tue, 07/18/2017 - 06:42

The icon star in layer text has fixed size and can not be changed on different screens. You can please add custom css to increase icon width for small screens.

Some text layers are not centralized because you added custom css that override default css from slider such as height, line-height, font-size. Example: font-size that slider caculates has unit 'em' , the new font-size has unit 'px', with 'em', fonsize will be changed following screen size but not 'px'.

By default, md_slider is responsive so we do not support setting height for slider. If you want, you can please try a solution as below: 

write js code to check browser, if site does not run on mobile device so you create a tag style containing custom css and add it to tag <head>. This custom css overrides default value sets height to 350px for class .md-slide-wrap, .md-slide-item. set height, width, top for.md-slide-item .md-maiming img.

phuonght's picture
phuonght
Thu, 07/20/2017 - 04:21

As we said at above comment, you have to add your own custom CSS code to customize height for slider on mobile.

phuonght's picture
phuonght
Fri, 07/21/2017 - 00:33

The height of demo is 400px and responsive on mobile device.

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.