Most voted "media-queries" questions
Media Queries is a module added to CSS3 that allows you to limit the scope of style sheets by adapting content presentation based on media resources (such as width, height and colors) without the need to change it.
Learn more…81 questions
Sort by count of
-
10
votes1
answer194
viewsWhat is the difference between Media Query Pointer and Any-Pointer?
I was seeing a way to determine if the user access is done by a Desktop, usually having a mouse as an interaction device. Or if the user is accessing via a mobile device, usually without the mouse…
-
7
votes4
answers2632
viewsWhat is the equivalent of CSS media queries in Javascript?
When I want to apply certain style according to screen size, I usually use CSS media queries. Example: @media only screen and (max-width : 768px) { .container { width:960px; } } I wonder if in…
-
6
votes2
answers1558
viewsMedia CSS queries not working and conflicting
I’m developing the one-page responsive and the documentation says to do the media queries as follows: @media(max-width:767px){} @media(min-width:768px){} @media(max-width:992px){} Uso Bootstrap 3.…
-
5
votes3
answers377
viewsHow do I work with responsive design?
I use Media Queries, right, and my layout will have to adapt to various devices like tablets, iphone, smartphones, notebook and Tvs, but I found a problem in the tablet in landscape mode, it has an…
-
5
votes2
answers3252
viewsHow to put the page number to be printed with CSS in @media print
I want to put the page number when the user wants to print my web page. For example, when it is to print my page, and it is broken in two, I want it to appear "page 01/02" and "02/02" on the pages,…
-
4
votes2
answers3675
viewsUse jQuery function only on @media screen and (max-width:960px)
We know that there are @media queries. They work with CSS. But I need to do it with Javascript. I need bxSlider to work only on @media screen and (max-width:960px).…
-
4
votes1
answer2712
viewsMedia Queries does not work
I am developing a Wordpress site that needs to be responsive and for that I am using media queries: <head> ... <link rel="stylesheet" href="css/style.css"/> <link rel="stylesheet"…
-
4
votes1
answer904
viewsHow to work with CSS media queries?
I would like some information on how to use media queries. How do I define media of a website in the below? 2560 x 1440 2560 x 1080 1920 x 1080 1366 x 768 1280 x 1024 1280 x 768 Being that my site…
-
4
votes3
answers273
viewsIncorrectly applied width media queries on mobile devices
I’m trying to use media queries on a website thinking about mobile devices, but I’m facing a problem: although the rules specify what to do when the width is small - and the same apply correctly…
-
4
votes2
answers548
viewsNavbar scrollbar does not appear on another width
I used the code below to change when the menu button for mobile is displayed and it worked, but the scroll bar does not appear in this size. What can I do to display the scroll bar? If I need to put…
-
3
votes2
answers483
viewsMedia Query for PC
Hello, basically I want to make two models of my site, one for mobile devices and the other for computers. I would like to make a CSS code that is read only by PC browsers, but if I use for example…
-
3
votes1
answer77
viewsMedia queries ignored from a certain resolution
Working with Mediaqueries for responsive layout, I came across the following problem: I’m setting the resolutions quietly, but when I get to 800px the configuration gives 320px and 360px. It is…
-
3
votes1
answer119
viewsBootstrap speakers
I have a question in bootstrap (v4-alpha). I created a <div class='row'></div> and within this div possessed 4 elements on each other’s side. <div class='col-3'> I wanted a…
-
3
votes1
answer70
viewsIs it safe to use grouped media queries?
All topics I found regarding media queries grouped are a few years. With the wide range of CSS3, grouped media queries are now considered safe to use in production? Do any browsers that support CSS3…
-
3
votes2
answers83
views@media screen not working properly
I’m studying css and html still, so I may be making some banal mistake, I’m not able to solve alone. The problem is the following I set on @media screen a minimum width for it to change the img…
-
2
votes1
answer474
viewsMedia queries for Internet Explorer 8 and 9
How to make IE 8 and 9 read Media Query conditions? I’ve read some Ocs but found nothing enlightening. The query is being made in the HTML example and I would not like to apply only in a single CSS.…
-
2
votes1
answer2835
viewsHow to put logo on sidebar or navbar depending on screen size?
I’d like to put a logo (Brand) in sidebar instead of navbar for larger screens and, when reducing the screen ratio (mobile devices and tablets and smarts), the logo should go to the navbar using…
-
2
votes1
answer182
viewsWhat is the best way to use Media Queries
What is the best way to use Media Queries for responsive max-width: or min-width:
-
2
votes2
answers713
viewsWhy is the screen size in the browser different from the real one?
I’m terrible when it comes to HTML design + CSS, but as a web programmer, I often find myself having to do it. Often I have to do such things media-query to adjust the layout. Question If I have a…
-
2
votes1
answer263
viewsShow mobile image when it exists
Hello, I have a CMS own and encoded a feature to allow, in addition to uploading image of default size, a second image mobile that will be shown with media query when the resolution is less than…
-
2
votes1
answer237
viewsMedia Queries Does Not Work Informed Measures
Good afternoon! I am working the first time with @media queries, I read a little I saw some examples but when doing my project I saw that it is not using the settings according to the measure…
-
2
votes2
answers40
viewsHow to modify the width for the adaptation on tablets of a menu without media queries?
Menu: http://responsivemultimenu.com/lib/responsive-multi-menu/ I’ve never seen a responsive menu like this, there’s nothing media queries, I believe the responsive part is created by javascript.…
-
2
votes1
answer127
viewsHow to change html data-start-height by Media Queries?
I have a website Based on a template I bought on themeforrest, the banner of the homepage of this site has its height adjusted by this attribute: data-start-height (which I had never used, I know…
-
1
votes1
answer176
viewsProblems creating media queries for Samsung Galaxy S4
I’m developing a responsive website and in it I set some CSS tags with media queries, but I still suffer with some devices, as an example, the Samsung Galaxy S4. I believe it’s because it contains…
css twitter-bootstrap responsive-layout media-queriesasked 10 years, 8 months ago Phellipe Lins 1,261 -
1
votes1
answer7206
viewsAdjusting the site to any screen
Good guys, I’m trying to learn better about the resizing of the site applied to any screen. I’ve read some tutorials on the internet and I can’t do everything right, because here in my test I apply…
-
1
votes3
answers118
viewsMedia Querie is not compatible with Internet Explorer 2014
I’m using the following media queries, Chrome is all ok. What are the right properties for the latest version of IE? @media(min-width:320px) { } @media(min-width:480px) { } @media(min-width:600px) {…
-
1
votes1
answer620
viewsMedia query does not work on non-responsive website
Good afternoon everyone, I put media query css3 to work on a fixed width site, but it doesn’t work. It only works on responsive websites? http://bblender.com.br/clientes/moldin/ @media only screen…
-
1
votes0
answers108
viewsMedia Queries messing up CSS
I’m making a website that has to be responsive first made desktop first I assembled all the css normally, so as soon as I finished I started to assemble the Media queries for a version tablet, I had…
media-queriesasked 9 years, 7 months ago Felipe Henrique 2,135 -
1
votes1
answer611
viewsWhat is the difference between max-width and max-device-width?
The question is exactly what is in the title, media queries I’m doubtful because in examples of some sites they use something like: @media screen and (max-widht:x) and in others…
-
1
votes2
answers3347
viewsMedia queries do not work
I made those medias queries for Desktop, follow the code below: @media screen and (min-width: 1024px) , screen and (min-height: 600px){ #menu ul { left: 26%; } .nomes{ margin-top: 200px; }…
-
1
votes1
answer1005
viewsHow to make responsive
I have this more advanced project , but I left it flat to facilitate the visualization and for you to help me =D , I tried everything possible using the media queries but nothing, I want the window…
-
1
votes1
answer330
viewsCSS Media Queries (several statements followed)
Hello, I want to know if it is possible to get a cleaner and more compact solution of the following CSS. @media screen and (min-width: 630px) { .tab ul.login{ right: 29%; } } @media screen and…
-
1
votes3
answers2842
viewsResponsive horizontal list that adjusts to 100% of parent div width
I created a list with some social media buttons, only the last button is from Whatsapp, and I don’t want it to appear in the version desktop, only in the mobile. So I created this media query:…
-
1
votes1
answer219
viewsShow Textarea Full Text in Print
Taaarde Galera, I have a question, where at the time of the print my textarea does not show the full text. I wonder if you could help me show him? Example of how this:…
-
1
votes2
answers115
viewsNavbar-Brand display on smartphones
I am Newbie and would like a help with a problem I am facing on my mobile site. I am using bootstrap. That is the result: The text Squish Monsters is pasting on the navbar, the correct result should…
-
1
votes1
answer153
viewsProblem with Media Query
Does anyone know how I can specify a Media Query for each device ? I’m trying to leave the iphone 6, 7 e 8 in a way and in the same cell phones only Plus version I’m changing to suit the layout only…
-
1
votes0
answers14
viewsAsynchronous content for mobile
I am working on a new website project, where some areas will need a special html treatment for presentation. For example: for the desktop, we have a 1920x800 image carousel, while on mobile, I want…
-
1
votes2
answers1047
viewsProblem with CSS media queries
I’m trying to make my application run on smartphones, beyond the desktop standard. But I can’t get the media queries to work properly. It’s only working until the size of the tablet screen. When I…
-
1
votes2
answers63
viewsDuplicate content when printing the page
was setting up a page to print with @media print, but when you click on print the content appears duplicated on two different sheets. HTML <div id="printable">CONTEÚDO</div> CSS @media…
-
1
votes1
answer195
viewserror while using @media
This is the page: http://www.dinamicaimoveis.com.br/novo/admin the css that’s the one: ... media screen and (min-width: 0px) and (max-width:480px) { .sessoes { width:100%; } .menu { background:none;…
-
1
votes1
answer36
viewsDisplay: None is erasing where it shouldn’t
When using the Display: none to exclude the h2 (containing the title) in @media, it ends up deleting the options present in the menu, even being the h2 belonging to the id: navbar and the menu to…
-
1
votes2
answers413
viewsProblem with @media query
I have a serious problem with Media Query, I am testing in this code and does not change the state at all, reduce the screen to the maximum and the colors continue without changing; HELP .box{…
-
1
votes2
answers70
viewsIs it possible to do this with table td?
Okay let’s see: //PHONE <table> <tr> <td>COL 1</td> <td>COL 2</td> </tr> <tr> <td>COL 1</td> <td>COL 2</td> </tr>…
-
1
votes0
answers158
viewsMedia Queries for Menu
I’m developing a page that has a menu that should display different behaviors according to screen dimensions. I’ll try to display this through some images. In the initial state of the menu (and with…
-
1
votes5
answers4689
viewsHow to change the content of an img src?
I’m trying like this but it doesn’t work <head> <title>Woman</title> <style> body{ background: black; } @media screen and (max-width: 767px) { .mobile { background-image: url…
-
1
votes1
answer275
viewsCSS - Media Queries loading backgrounds. How do they behave?
I’m making a website responsive and would like to upload different images in the background depending on the device. I will respect the use of data from mobile users and do not want to force the…
-
1
votes1
answer99
viewsProblem coloring table rows in print using @media ASP.NET MVC
In my view the result of my table is as follows: In printing: I put my css styles used in the view inside @media as follows: <style> .form-control { min-width: 100% !important; } .p-periodo{…
-
1
votes2
answers429
viewsRemove CSS image links in @media print
My blog shows the links when printed through a[href]:after { content:" (" attr(href) ")"; }, however I don’t want it to show the image links, since I also removed them from the CSS for printing. Is…
-
1
votes3
answers42
viewsKeep images online even on mobile devices
I have a div which contains some icons, which are aligned horizontally, but according to the size of the screen on which it is displayed a line break is generated, my goal is to prevent this from…
-
1
votes1
answer45
viewsMedia Querries Breakpoints are colliding
Fala galera! I made a website for my portfolio and in it I had the following problem: The site is done on one page only, so I had to adjust the sizes of the sections to the media querries. I did…