Bootstrap showing only background image on android browser - html

I developed a mobile site using Twitter bootstrap, site is rendering very good on desktop browsers as well as on some mobile browsers, but on android's default browser the site is only showing background image.
Can anyone tell why this problem is there?
Live site: http://logicvibes.com/demo/business-design
screenshot:

Related

Differences between Desktop Wordpress dev console and iPhone Safari browser window

I'm having a problem with Wordpress. I've styled my website in the customize console in Wordpress on my Desktop, but when I open it with my iPhone (can't confirm if this is happening with other mobile browsers) there is this gray border on the outside of the block. Here's a screenshot:
https://imgur.com/a/A3nEgTy
I can't find any information about this or find anything about other people having this issue. Is there some way to access the source code or Inspect tool in mobile Safari? Just trying to make the block fill the screen.

Why the search bar's display is difference between IOS and Android in website?

I design a site with wordpress and I have a problem in some cases in mobile display. For example in IOS in the search bar, content doesn't display complete but in Android is OK !
this is the android screenshot :
and this is the IOS screenshot :
How to fix this ?
this is my site : matiloos.com
The difference was in the browsers. iphone use safari browser and for responsive website in iphone We should check in safari windows.
For this problem I set height for input element and problem solved.

CSS Fullscreen background does work in Dev-tools but not in real browser

I have built a Meteor App/Website and I am trying to have a responsive fullscreen background image at the top of this page (https://www.conducate.com).
It works as expected in the Chrome Developer tools as well as in the Safari Responsive Design mode, but when I deploy the page and look at it on my mobile, it seems to zoom into the top part of the image, and does not resize it as expected from the dev-tools. As a result, there is just a grey blur to see.
Has any of you come across this problem before? It is hard to debug, since it works correctly in all the developer tools, but not at all when actually viewed on a mobile device.
Below is a link to an image with screenshots, one from my mobile (iPhone 6s, safari browser) and the other from the safari responsive design mode on my mac. Unfortunately, I am unable to post an image due to lack of reputation, so I can just post the link - I am still a newbie here...
https://s3.eu-central-1.amazonaws.com/conducate-images/stackoverflow/example_screenshots.png
Any help is much appreciated!
After some searching for iOS specific issues, I finally came across the solution to the problem by looking at some other examples.
It turns out, that most browsers understand the css line
.container{
background: url(http://www.link-to-image.jpg)
...
}
This is not the case for iOS, here you need to specifically state that it is an image, that is used for a background.
.container{
background-image: url(http://www.link-to-image.jpg)
...
}

My website does not display images on iOS

I have built a custom website, and am viewing it on my iPhone 4 that is running iOS 7. The site has a few images on it, but none of them are loading. All that shows is the image's alt tag. The site works fine on my iPhone 6s running iOS 9, and on every other device that I have tested on.
Does anyone know why are the images not loading on my iPhone 4 (running iOS 7)?
Here is a link to the website: http://testingsite1.herokuapp.com
It appears that your images are massive in size!
An image you're displaying at about 250px x 300px is actually 2687px x 3356px. That's way too large. The background image is also too large at 3000px x 2000px.
Make your images smaller if you want them to display on old devices with limited RAM.
Test how well does your browser support html5 on https://html5test.com
Keep your browser still up to date.
Test on iPhone 4 with most popular browser like Firefox, Chrome, Safari, and less.
Use Front-end Framework: Bootstrap, MDL, Semantic UI and more. Style in image will automatically works fine.
When you develop your website, you can use DevTools to view with device mode on your browser.

Iphone does not display background-image

I'm making a mobile website, when i display the page on my desktop an discrease the window size it works perfectly, but when I open the website on my iphone it does not display background images.
Someone can help me?
http://i305098.iris.fhict.nl/mobile/
jsfiddle.net/8r2umLkj/
Try on another mobile device. It seems to be working fine for me.