I created a page that has a navbar from bootstrap 3.
In firefox v.37.0.2 the navbar is like this:
But in another computer that it has same firefox (v.37.0.2), the navbar is ok:
Also the page and navbar is ok in chrome v.42 and IE v.11.
Why this happened?
Not an answer but couple of crosschecks you can do
Check screen resolution of another computer
Check if you are testing in already zoom in browser (Press Ctrl + 0 to make it normal)
Very least but cache could be one problem
Related
I have a problem with one of my projects where I use TailwindCSS.
The page looks all right on Desktop, Tablet and some phones, but for some of them, the website has a horizontal scrollbar.
This problem is only happening on Google Chrome on iOS (iPhone 11 Pro).
On iPhone 5 everything looks fine; no horizontal scrollbar.
On Safari the website looks alright on all devices (mobile, tablet,
desktop).
I've done something wrong, because I can't figure out what's happened.
The problem can be found here
P.S.: I added overflow-x-hidden on body to prevent the scrollbar, but didn't work.
Thank you!
Ok, so i found the problem, is realated to aos.js library that i have loaded for animation on div's elements. On mobile the library creates a "side space", after i deleted the animation, everything looks ok.
Thank you!
The entire screen flashes blue briefly with mobile chrome and hyperlinks using responsive.menu in wordpress. I'm looking to remove this effect.
You can reproduce the issue by using chrome and putting the browser in mobile mode. Navigate the browser to http://responsive.menu and use their menu on the right hand side, simply click the plus and minus arrows on the sub menu to demonstrate the effect.
Also, a screen shot and screen cast:
Shot:
https://drive.google.com/uc?export=download&id=0B-M6Yes83t08RjJ1T1IxU2JDTjg
Screen cast:
https://drive.google.com/uc?export=download&id=0B-M6Yes83t08cTRJbXNNTGdjcmM
From the author of the component:
it is due to the fact that for mobiles to detect a click event on the
body of the site without reverting to loading the jQuery mobile
library, I have added cursor: pointer; to the body.
This has the side effect of creating these blue flashes on mobile
Chrome as the browser now thinks that the whole body is a link. The
quickest option is to turn off the "Click to close menu on body
clicks" option while I see if there is a workaround in the long term.
The only way around this I can think of is to load jQuery mobile
separately, but I was always reluctant to do this.
Question update:
This only happens on chrome mobile - how do you emulate safari and firefox mobile behavior?
I made a carousel to fill 100% height and width of browser and it does that fine on a desktop or in protriate mode on a mobile but when switched to landscape the display breaks. I made a bootply but it doesnt show the error im refering to. Maybe its caused by the form I have added?
http://www.bootply.com/BKl0fXVMrj
You can see the actual error here. Open dev tools select a iphone4,5,6 galaxy s4,5.. pretty much any current smart phone and you will see what I mean.
http://www.casouza.com/homelist
After my previous comment I looked deeper into this, try the code below in your CSS.
#bg-slide-carousel .carousel-inner {
position:fixed;
}
This makes the background carousel stay with the viewport. I've tested this in the chrome dev tools emulator with the site you posted and it appears to work fine.
I am using bootstrap to develop a responsive website. I have tested it in Firefox, Chrome and IE where everything seems to be working, but the dropdown menu (in main menu) adds a offset to it self in Safari.
I checked the Safari inspector to see what went wrong, but the inspector seems to think that the dropdown menu is displayed correctly - even though it is not.
See http://birdatwork.com/stackoverflow/safari-bug.html for an example of what I am talking about.
The site can be seen at http://kik.vejnoe.orvad.net/en.
Hope you can help find out why it happens.
I have not found out why it happens, but I have found a solution. The solution is that I wrote some JavaScript that listens for clicks on menues and window resize events (only in Safari). Whenever one of these events happens the code will position the menu to the left by using the jQuery offset function.
I got a very simple jquery lightbox that works fine everywhere except in iPad Safari 4.3.1 ! The lightbox wont open when clicked.
Here is the link :
http://jetransmetsamessalaries.fr/
Scroll down to < Pourquoi transmettre à ses salariés > and the lightbox is on the round stamp with the face of one man.
Unfortunately, fixed position is not supported in iOS 4. So we got to use js or other solutions of the same kind. See more info here:
http://www.quirksmode.org/blog/archives/2010/12/the_fifth_posit.html
How to resolve position:fixed for a bottom toolbar on iOS (iPhone/iPad)
Fix position:fixed in iOS 4