Questions tagged [device-width]
57 questions
1
vote
1 answer
Media query max-width: 767px is not applied even though the width is 767px
Here is codesandbox link: https://codesandbox.io/s/767px-problem-u9temt?file=/style.css
I have made a CSS query rule:
@media screen and (max-width: 767px) {
div {
display: none;
}
}
which should mean that the div will be gone if device…

Andrew Slock
- 21
- 3
1
vote
1 answer
How to manipulate screen-size/viewport size, so desktop will display mobile version of website?
Sorry for the ambiguous question, coding noob here. Essentially, I have a site where the entire container is set to 100vw, and then font-sizes also set in vw. This works so that no matter how I scale the site, on mobile or desktop, it'll display…

hayakaweis
- 11
- 2
1
vote
0 answers
Why won't my viewport tag properly use device width on most mobile devices?
I am using following meta tag.
user6391799
1
vote
1 answer
CSS media query orientation and portrait device-width logic
I have two divs, which I'll refer to as A & B. The desired behaviour is:
If the screen width is less than 400px, only A should be visible.
If the screen in landscape, greater than 400px in width, but less than 400px in portrait orientation, only B…

tommarshall
- 2,038
- 5
- 23
- 36
1
vote
1 answer
Phonegap Android screen.height and screen.width returning black system bar space
I develop apps with Phonegap for Android.
In some of those apps I use javascript to make some dynamic calculations and place elements on screen.
The app uses Fullscreen preference in config.xml
So far that has been working well, but today I noticed…

Vero
- 1,742
- 3
- 15
- 29
1
vote
2 answers
Handling device-width on a fixed-width website
I have a website that has a fixed width of 1024px and is centered on desktop. On mobile devices, the width should match the size of the phone or tablet.
When using device-width, like this

bytecode77
- 14,163
- 30
- 110
- 141
1
vote
0 answers
Different style depending on device's width and height
I have to define different textarea heights, depending on the device:
if the user is using an iPhone 4, the textarea's height must be 62px,
if the user is using an iPhone 5, the textarea's height must be 106px.
This is my current CSS. It works for…

Andres SK
- 10,779
- 25
- 90
- 152
1
vote
2 answers
not working
I'm making responsive website with bootstrap 3, and it works when I resize my browser. But when I open website from mobile (Nokia lumia 920 internet explorer), it is not responsive at all. Bootstrap columns are not working, breakpoints are not…

Alex
- 129
- 1
- 2
- 15
1
vote
0 answers
ie9 media query device-width
I am working with media query, for a desktop version of a website.
The behavior that I was looking for was:
- Full screen rendering
- No redimensionning when minimizing the viewport (the right sided content is hidden)
So I defined ranges of…

TheJohnCalaganProject
- 87
- 1
- 2
- 7
1
vote
1 answer
Bootstrap - why minimum media query 768px?
My phone (LG G2) has a viewport size of 360px 598px.
Col-xs aims devices smaller than 768px, so that means that wether the user is in portrait or landscape mode, he will have the same result, even though in landscape mode i could display more…

Matthew
- 10,988
- 11
- 54
- 69
1
vote
1 answer
Mobile Screen Device Width
I have done my research on mobile screen widths but there is something I can't quite have a direct answer too.
Take the iPhone 4 for example, at this site it has a width of 640px and a height of 960px. However it has a device width of 320px. What is…

Jack Trowbridge
- 3,175
- 9
- 32
- 56
1
vote
3 answers
Mobile content witdh(body) = media width, but user can still scroll
I overlooked all the web ( i guess) and tried to find the solution for this task:
I have all requirements to show a correct content on mobile(I mean meta media and css media and so on), but on my android phone I can scroll to the right. I checked…

Vasilii Burlacu
- 180
- 1
- 8
1
vote
0 answers
wordpress menu mobile placement issue
I have an issue with my main menu on iPhones and possibly android phones. The menu width is set to 100vw up to 600px. However, on a 320px or 480px screen, when the menu button is clicked and when one enters the page, the page zooms out a little bit…

Johannes Persson
- 25
- 1
- 9
1
vote
3 answers
CSS: I always seem to need multiple identical media queries
So I always seem to do two identical media queries for smartphones, one being the min- or max-width, and the other being the min- or max-DEVICE-width (to target the iPhone and stuff)...
@media only screen
and (min-device-width : 320px)
and…

Dave Lunny
- 13
- 3
1
vote
1 answer
Meta viewport - Device-width need to be a minimum
We have created a website that is optimized to 480px. But if we set the meta viewport to device-width with initial scale = 1 then on the iPhone the width is 320px and the site is to wide.
When setting the initial scale on 0.65 the site is good on…

BastB
- 11
- 2