White space on the right of page on mobile devices
White space on the right of page on mobile devices
I learn to build websites. Now I'm making page to practice and I have a problem. I haven't already made it responsive but I've seen that below 630px width page isn't 100% width anymore. On the right of the page appear white space and I don't know why is that and how to fix that.
Can you help me?
screen of my problem
1 Answer
1
This happens if any box (e.g. an <img>
, a <span>
or a <table>
) is wider than width of browser window.
<img>
<span>
<table>
Images does not shrink and words does not break by default. Boxes can not be smaller than all cells in a row together.
Utilize different responsive techniques to avoid overstretching of viewport.
img
max-width: 100%;
a,
p,
span
hyphens: auto;
/* wrap tables in <div class="horizontal-scroll-wrapper"> */
.horizontal-scroll-wrapper
overflow-x: scroll;
Browser's built-in inspectors helps to find types of not shrinkable elements.
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
can you show us your code please?
– ACarter
2 days ago