i know this is not a question about source code, however i need to find the solution. So, This is my site.
After i finished making the site, I resized my browser window, the responsive css worked perfectly. However, when I tryied to see my site from my mobile phone the only thing I could was the top bar..
Related
I'm a novice at HTML and CSS and I launched a simple responsive website with only one page, but then I managed to add a couple of pages more to it after a few days. Everything looks good on desktop and when I make it smaller to 350px width via developer tools, it actually looks good as it should and all responsive.
Link: https://transporte.capital/
However, when I enter it from my mobile phone it looks horrible as CSS becomes almost inexistent. The logo becomes a link with underlines, the tweet widget is still there (I disabled it via display: none; in media queries because it takes too long to load), the social media section is distorted, all images are huge, and so on.
Is there something wrong with my mobile phone? I tried to look for cache in Site Settings - Data Stored in Chrome, but there was nothing for my website there.
Now I tried the Opera browser and the website looks good as it should. What should I do to make it update on Chrome? And will it update as it should the next time I make changes to it? Thank you!
screenshot 1
screenshot 2
I could see the page properly in my Android mobile Chrome browser. Please clear cookies once and ensure the zoom in is not enabled. Attached is my screenshot. Screen size: 393x719px
I am just a writer, no knowledge of web programming. If you look at my page here: https://nataliaputilova.blogspot.com/2019/09/blog-post_50.html it looks normal.
But if you look at the screenshot from my phone (attached), it does not. What is the issue, how can I fix it? The same problem shows up on both iPhone and Android.
I know in the past it worked, but then I did some changes per How to reduce left margin on blogger that I think messed up the mobile view. I tried to undo them, but I was poking around a lot and I don't know what I changed exactly
Screenshot from iPhone:
(there's not even scrollbar at the bottom to move left-right, just this fixed partial view)
I tried to google if it's possible to customize the mobile version, but the results said for these modern themes it should work automatically. But the mobile version is not good, what can I do?
I'm not an expert in web and I composed and updated my website recently. I ran all the test that I could on DreamWeaver CC and tested on multiple mobile devices (tablet, android and iphone); all seems to work fine. Until I uploaded the site to my server, the site start to act weird.
1st problem:
It is a portfolio website with individual pages to corresponding projects. On each project page, the first image on the lightbox has always gone missing; but clicking into the lightbox I can find the missing image (the preview image and the lightbox image share the same source so if the lightbox can find the image it implies that the image is on the server and the path is correct).
2nd problem:
when the browser is shrink below certain size, a toggle menu will replace the content on the header, clicking the toggle menu will show a pop up menu to site links. For some reason, after uploading the site to server, the toggle menu pop up never work.
3rd problem:
The above problem is never apparent on desktop browser(all image shows up correctly; toggle menu works). To make the problem more complicated, I can't confirm if it is device or browser oriented problem. For example, the site works on chrome browser on my iphone and nexus 5(android), but problem occurs on my xperia tablet(android) chrome browser; on my xperia tablet, the site works perfectly on firefox.
Does anybody has any idea what the potential cause to the problem, and perhaps a direction to a solution?
Here's the link to my site: http://www.itsatommy.com
Thank you for your time and look forward to any reply.
Looks fine to me (Google Chrome), you need to use media queries for some certain resolutions. You also need to use some cross browser css tags lide "-webkit, -moz, -o" etc.
i have a question, where i hope someone can guide me.
I have made an homepage, and everything is working great, besides a few things that is miss placed in Firefox, and looks perfect in Chrome.
As well the site, looks abit weird on phones.
www.securehome.nu is the homepage.
Basic knowedge about the homepage
The site is created in Visual Studio
The site is build up around a MasterPage
Info about the problems
- The menu bar have some borders (the lines that splits each menu field from each other, those borders aint positionen the same place in firefox and chrome.
- On the phone, there is a white field in the bottom, even that the wrapper is height 100%, and it works smoothly on computer browsers.
I can easily put the whole site into a winrar document for download if someone wants to try play around with it, and help me what the problem is.
As i can see there is no problem with my both browser they are looking same and there is no responsive view for mobile of your site
I am a complete novice when it comes to website design, but have the task of designing a website for an academic conference. I wanted to design a functional site to which I understood the code behind it. I have managed to do so, but am now having problems with viewing it on a smartphone. When I have checked the website on online simulators such as brick and mobile is seems to work fine. However, when colleagues of mine with smartphones try looking at it, the main content area will not scroll. Does anyone know of a way to resolve this. The url to the website is:
Conference Website
Edit: The problem appears to be on android phones. If you zoom in a tiny bit you can then scroll alright, and if you move to a portrait view rather than a landscape view it is fine, but it will not scroll on a landscape view on an android.
You might want tot try adding viewport meta to your header, ensuring every device sees your site at the optimal width (this eliminates the user having to zoom in on most mobile devices).
You can find some good information for this in the following article: http://www.html5rocks.com/en/mobile/mobifying/
There are some zooming issues with the website on a Samsung Galaxy S2. This has mostly to do with your menu, which is set to 21%.
Furthermore you're setting height on a lot of elements to 100%. You might want to look into that as well.