Responsive Issue

I am designing a website for my client. I am stuck in responsiveness of a page here is the link: here what I want in the slider section the content that boxes should scroll over the slider the boxes should not exceed the height of the slider image it should be inside and scroll over the slider on the mobile screen.

if anyone can help me out of this I very thank full to him. I will provide the source code.

Hi awaiszaki14,

Responsive, I find it hard to get a grip of the issue with only your description of how the boxes should behave.

Could you please provide a guest login, or else bypass the sign-up and link to the same page as your screenshot?

As a visitor I don’t have access to see those boxes, and I don’t want to register an account or dive in to the source code just to see what you have so far. :slight_smile:


@Erik_J thanks Erik for your kind response here is the source code
Luberack source code

Download it and make it responsive if possible

I think you misunderstand what the forums are for @awaiszaki14. People will help you with your issues, but don’t expect them to do your work for you.

1 Like

so how any one can provide me solution if they dont look into my source code

I looked at the page that you linked to and didn’t see anything resembling a slider or responsive code. Do we need a login? Perhaps you need to describe where we should be looking.

I have made other 13 pages responsive but I am stuck on the slider section thats different from other pages thats why I asked.

I think you’ll find that most members are, quite rightly, reluctant to download zipped files from an unknown source. Likewise, nobody wants to have to register and log in to look at your code.

I’d suggest that either you create “test” login credentials we can all use (and which you can, of course, delete once your issue has been dealt with) or post the problem page somewhere where we do not need to log in to see it.


here is the link check this

demo page

1 Like

The code is nicely formatted!! Unfortunately, I am not a Bootstrap person so someone who is familiar with Bootstrap will have to pick this up.


Unfortunately you have a flawed construct even for bootstrap.

You have set the image to 1200px height and then absolutely placed some content on top of the image. If the content is greater than 1200px (which it will be when it wraps) then your content overflows the image and the rest of the page.

What you should have done is placed the image as a background (background-size:cover) to the content and let the content dictate the height (or have a min-height).

I see no easy solution to this other than giving your main-text element a height of 1150px and setting its overflow to auto which will look a little messy. Alternatively hide the image on smaller screen altogether and remove the absolute positioning to put everything back in the flow.

A re-design of that section is required with more thought about how to make it responsive to start with rather than trying to squeeze stuff into bootstrap sliders and hoping for the best :slight_smile:


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.