- Posts: 123
- Thank you received: 0
Issue with Carousel/layout of bottom row in mobile view
-
paul1
Active member - Topic Author
- Member
Less
More
10 months 2 weeks ago #51133
by paul1
Issue with Carousel/layout of bottom row in mobile view was created by paul1
www.buchanaccommodation.com/J5
Joomla 5
Hi - many thanks as always for great support.
1. In mobile view the image title displays oddly. Set as white text and box drop shadow - I can change colours but far too large to be used. Can this be turned off for mobile view, so just shows images? I am using Hot Swipe - is that the best for this type of use?
2. At the bottom of the page, the 4 bottom positions show as two wide, with two below. How can I set them to show single module, width of mobile wide?
My thanks Paul
Joomla 5
Hi - many thanks as always for great support.
1. In mobile view the image title displays oddly. Set as white text and box drop shadow - I can change colours but far too large to be used. Can this be turned off for mobile view, so just shows images? I am using Hot Swipe - is that the best for this type of use?
2. At the bottom of the page, the 4 bottom positions show as two wide, with two below. How can I set them to show single module, width of mobile wide?
My thanks Paul
Please Log in to join the conversation.
-
milos
Support Staff - Moderator
Less
More
- Posts: 6744
- Thank you received: 716
10 months 2 weeks ago #51136
by milos
Replied by milos on topic Issue with Carousel/layout of bottom row in mobile view
Hello,
1. Add this in /media/templates/site/business/css/custom.css file:
This will remove the text if screen size is less than 767px width.
Also, in the module options, check under Module Properties > "Responsive Text Box Screen Width". Delete the value and make this field empty. Save module options.
2. Edit file /media/templates/site/business/css/custom.css and around line 1155 change this:
to this:
Regards,
Milos
1. Add this in /media/templates/site/business/css/custom.css file:
Code:
@media (max-width: 767px) {
.hot_swipe_carousel_slides .contents {
display:none !important;
}
}
This will remove the text if screen size is less than 767px width.
Also, in the module options, check under Module Properties > "Responsive Text Box Screen Width". Delete the value and make this field empty. Save module options.
2. Edit file /media/templates/site/business/css/custom.css and around line 1155 change this:
Code:
.user_row .sparky_cell {
width: 50% !important;
}
to this:
Code:
.user_row .sparky_cell {
width: 100% !important;
}
Regards,
Milos
Please Log in to join the conversation.
Time to create page: 0.143 seconds