Hi All
I have a responsive site that I’ve borrowed some code for expanding text. I can’t see where the css is forcing the container to fill only about 70% of the screen on the page with the expanding text.
I’ve tested at responsinator and mobiletest.me and neither of those reveal a problem. It’s just on my iphone 6 in both chrome and safari…
The page in question is at http://purple-mouse.co.uk/ym/schools.php
This is the only page that refers to moreless.css so the problem but be in there somewhere.
The other pages are fine.
I know the answer is really “don’t pinch code you don’t fully understand” but I’d like to fix it if I can.
Thanks in advance
Mandy
Can you point out which container and where this text is?
I can see a horizontal scroller, but have not yet identified where it’s coming from.
You are getting a horizontal scrollbar at 1320px due to the label element that you have set to 100% width and given a margin-left of 70% (and 50% small screen).
100% + anything is always to big to fit into a container and small screens need to make the layout as wide as this widest element thus resulting in the rest of the page being squashed to the side.
Remove the width from your label rule or set it to auto:
label{width:auto}
1 Like
Wow thanks PaulOB
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.