Hi. I am working on our website and making some changes. I made a new looking “Faqs” component on the backend for our Austin page. However, it looks good on desktop but when I go to mobile it’s all off centered and does not look great. I tried to change it in the mobile version but then the desktop version got messed up. Please advise!
Hello Ashley,
You are having this issue because you do not have a Responsive Styling applied to your component. The Absolute position of the DIV element has affected the display. I made a demo that DO NOT have “Absolute” positioning and only uses Flex layout. Kindly check out the link in the secure note below.
Best Regards.
Thank you so much, that helps a lot! just for my own knowledge, where do. I apply the responsive. styling? I see your secure note but I can’t find that button and I want to make sure once I create the others it is the same.
Thank you!
Hello Ashley,
To set responsive styling, go to any element’s settings (e.g., Flexbox → Column → Flexbox). Click any setting, like ‘Direction’ to open the breakpoint popup, where you can configure values for each device size.
It is available for all the settings. Please have a look at this documentation and video tutorial as well.
Thanks
Hi! Thank you this is super helpful, however, I am curious how we can get the whole component responsive? When I watched the video it just shared that the test and color and stuff can. be changed manually. However, when I went into our FAQs that Rue Edited all of his text sizes and everything is the same all the way through so I want to know how he did that.
Hello Ashley,
Previously, you were using the DIV element positioned as “Absolute”. This is what is causing the problem in smaller screens. In my demo, I switched to “Relative” and played around with the height of the DIV element instead:
At the moment, the FAQ demo I have tweaked still uses a DIV element set to “Relative”, relying on the width and height settings to display smoothly across different screen sizes.
Hope this helps.
Hi, thank you for letting me know. However, I changed the Div to relative on the new on that I am working on “Austin contact 2.0” and there is no adjustments when I play around with it. I am not sure what I am doing wrong, but if you would be able to provide a screen recording on how you do it on the contact page that would be very helpful.
Hey Ashley,
Runel has also played around with the Height of the Div. Please try editing the Height as well as the Width. Try them to percentage unit also.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.