Solved

Can I use a * wild card in a media query?

Posted on 2015-01-01
2
179 Views
Last Modified: 2015-01-01
Well, I guess we'll see if there are any "true geeks" workin' the holidays. :)

I've developed a simple webpage. Basically it is a fixed bg image with a video player that you can scroll down to (which actually pulls it up to center over the bg image). On smaller devices (primarily smart phones), I only load the video player with a solid black bg - that is, no bg image.

I've used media queries to load appropriate bg images on different larger devices based on 3 different aspect ratios . . . the ones that seem to be the most common in "the computing world." (16:10, 16:9, and 4:3). My question is, can I use a "device-aspect-ratio: *" query to load a generic bg of some sort for all other aspect ratios?
Is that how I would express it, by just putting an * where I would normally put say 16/9 or whatever?
0
Comment
Question by:Thunderman54
2 Comments
 
LVL 38

Accepted Solution

by:
Tom Beck earned 500 total points
ID: 40526593
Just specify a default background image before anything else in the "cascade".

Example:

body {
    background-image: url(...)
}


Then cover all the exceptions.
0
 

Author Comment

by:Thunderman54
ID: 40526639
Sounds good. I'll try that and get back with you. I'm getting ready to post another question maybe you can help me with. Has to do with Firefox (testing on Android tablet) not interpreting my stylesheet, media query or both.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

911 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now