My Bootstrap Website Issue with Body on Smart Phone [closed] - html

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
A while ago I created www.readourlips.org and it looked great on phone and computer. But now, the index.html page is narrow when viewed on an iPhone (at least mine) because the body color is visible (see photo)
Does anyone know why this would suddenly change? It's not essential but the site doesn't look great anymore on a phone (only home page though)
Thank you all,
website is http://readourlips.org
David

The map at the bottom of the homepage is pushing the website to the right side, make the map have a width=100% and this will fix it
Take out the width attribute on the iframe tag, and put the width=100% as inline css

Related

Blank vertical column/space to the right on ipad mode [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I am in the process of creating this website
if you open developer mode on chrome and change to ipad there is blank column to the extreme right that runs throughout the page. I have no idea whats causing that break and i want to get rid if the space. All I can see is there is a border:box property from reboot.scss. bootsrap 4 is used in this development
any pointers will be much appeciated
Just add
html, body {
overflow-x: hidden;
}
Since you have overflowing/long link to the mail, it is taking up the area. If you use word-break for the same it works, depends on how you want to handle it.

Why does my website show two headers on a smartphone? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
For some reason my website shows two headers (the Desktop Header + the Mobile Header) when I open it on my smartphone. Can you imagine what the cause for that is?
https://www.globalmarshallplan.org/
Because in small screen resolution appears additional block for header, but existing block (for desktop) don't hide.
(x-hide-xs x-hide-sm x-hide-md) add these classes to the desktop version

Responsive website works fine on Firefox responsive mode, not working on Chrome Mobile or trough broswers like Instagram and Facebook ones [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
I am using vanila Css and having sucsess on the mobile Firfox broswer but a a problem occuring using Chrome broswer.
Here is the link.
Man i could not fixed. removing the footer which is fixed only partly solves the problem the right blank white
There is a "#footerTxt" element in the "#footer", you may modify it's css. If you remove the 'width' from it, the view is will normalizing (white space will remove from the right side).
You need to change/modify this "#footerTxt width" property.

CSS - Height/Overflow Issues [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
Basically, When I am on my PC on my site it is fine everything is formatted Correctly.
But when I zoom out it makes the background html colour show (Void kinda). No idea why its doing this but some users have pointed out that tablets and specifically iphones show this just from normal browsing.
Not sure as to what kind of code I can show as an example so just checkout the site: http://toolnet.work/
You have to use CSS Viewport Height unit where 1 vh is relative to 1% of the height of the screen.
div#page-wrapper {min-height:100vh;}
or
<div id="page-wrapper" class="gray-bg dashbard-1" style="min-height: 100vh;">

CSS problems with our eBay custom HTML template [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
we are building a template for our eBay listings.
eBay allows users to upload a description as HTML code and allows that code to link your external CSS files.
eBay displays the user's HTML code in an iframe, it looks like eBay calculates the height of your page on load and then and resizes the iframe according to that height.
Here is a link to one of our test listings in eBay's sandbox environment:
http://cgi.sandbox.ebay.com/ws/eBayISAPI.dll?ViewItem&item=110097353751&ssPageName=ADME:L:LCA:US:1123#ht_692wt_1136
In Chrome / Firefox there's a second scroll bar next to the listing.
In IE, the listings just covers eBay's footer which is even worse
I solved this issue once using CSS and i can't remember how.
I would really appreciate any help.
Here is our CSS code:
http://pastebin.com/aj4bffG9
Just remove this line from the #StartDescription rule in your CSS file:
height: 650px;
With this change, it works fine for me in Chrome/Firefox/Opera.