Archived topic
Responsiveness has broken
3 replies · Started by troyw on November 3, 2022
Hey team,
Not sure why, but my website is suddenly not working responsively. If you check the Home Page for example, you will see that it is not presenting well on mobile devices.
I have identified the CSS causing this to happen, but cannot seem to change the CSS to stop it from happening.
.wptravel-layout-v2 #page #content {
display: flex;
flex-wrap: wrap !important;
}
.wptravel-layout-v2 #page #content .wp-travel-toolbar{
display: block;
flex-basis: 100%;
}
This CSS is somehow affecting the blocks and thus breaking the Mobile sizing, but I don't know why?
Any idea how I can fix this?
Thanks
Hi Troyw,
How about placing them inside a Media Query so they don't apply on Mobile view?
Example:
@media (min-width: 769px) {
.wptravel-layout-v2 #page #content {
display: flex;
flex-wrap: wrap !important;
}
.wptravel-layout-v2 #page #content .wp-travel-toolbar {
display: block;
flex-basis: 100%;
}
}
Hahaha, yes that is it Fernando, thank you.
You're welcome Troyw!