WordPress.com Forums » Tag: CSS3 Media Queries - Recent Posts

designsimply on "Adding Retina Graphics"

designsimply — Tue, 03 Apr 2012 15:42:44 +0000

Certainly. :)

Here is an example showing how to do it for the iPhone 4 based on pixel ratio:

@media
only screen and (-webkit-min-device-pixel-ratio : 2),
only screen and (min-device-pixel-ratio : 2) {
    /* CSS for your header image goes here. */
}

pixelcounter on "Adding Retina Graphics"

pixelcounter — Tue, 03 Apr 2012 05:05:19 +0000

Thanks for the info!

Is there an easy way now to replace, for instance, the header with a high-resoution image?

designsimply on "Adding Retina Graphics"

designsimply — Mon, 02 Apr 2012 19:29:55 +0000

@pixelcounter, adding high-dpi graphics is now supported at WordPress.com. :)

Try copying the example at http://aralbalkan.com/demos/high-dpi-images/ if you'd like to test it out.

alexbilmes on "CSS3 media queries getting stripped"

alexbilmes — Mon, 26 Mar 2012 16:35:02 +0000

Thanks. Working :)

philiparthurmoore on "CSS3 media queries getting stripped"

philiparthurmoore — Mon, 26 Mar 2012 08:29:29 +0000

@alexbilmes: Awesome news. We rolled out an update a few days ago that should allow you to use pretty much all the CSS rules you need, except those that would introduce security issues on our end. Can you give it a spin and let us know how it goes?

alexbilmes on "CSS3 media queries getting stripped"

alexbilmes — Fri, 16 Mar 2012 21:04:45 +0000

Can you give me an approximate timeframe? Do you anticipate rolling out this feature over the next month?

michiecat on "CSS3 media queries getting stripped"

michiecat — Fri, 16 Mar 2012 20:44:27 +0000

CSS3 Media Queries are currently not supported. We're working on an update to our CSS editor that will enable support for media queries. I can't give a timeframe, but we are definitely working on it!

alexbilmes on "CSS3 media queries getting stripped"

alexbilmes — Fri, 16 Mar 2012 20:35:57 +0000

I'm assuming @import isn't allowed either?

alexbilmes on "CSS3 media queries getting stripped"

alexbilmes — Fri, 16 Mar 2012 20:34:36 +0000

Is there any reason why they are not supported? Will they be supported soon?

sl1k on "CSS3 media queries getting stripped"

sl1k — Fri, 16 Mar 2012 19:45:25 +0000

Thread moved over to Theme forum section

thesacredpath on "CSS3 media queries getting stripped"

thesacredpath — Fri, 16 Mar 2012 19:18:52 +0000

Media queries are not supported at wordpress.com at this time.

timethief on "CSS3 media queries getting stripped"

timethief — Fri, 16 Mar 2012 19:12:53 +0000

Hello there,
I have flagged this so it gets moved to the Themes Forum. Themes Staff answer question in the forum and I think it's the best place to draw attention to your issue.

alexbilmes on "CSS3 media queries getting stripped"

alexbilmes — Fri, 16 Mar 2012 17:23:56 +0000

WordPress.com is stripping out CSS3 and media queries, which is breaking my design. Is there anything I can do to get them working? This is standard CSS so I'm not quite sure why this is happening.

designsimply on "Adding Retina Graphics"

designsimply — Mon, 20 Feb 2012 19:52:56 +0000

I agree! Love that you posted about it. We've put it on our things-to-update list. Would love to also see more people reply here or send us a note if there is more interest.

pixelcounter on "Adding Retina Graphics"

pixelcounter — Mon, 20 Feb 2012 10:42:13 +0000

Okay, thanks designsimply. I'm pretty sure the high-dpi graphics are becoming more relevant day by day.

designsimply on "Adding Retina Graphics"

designsimply — Sat, 18 Feb 2012 21:04:20 +0000

I see that there's a way to add retina graphics using CSS3 media queries, but that's not available yet for the WordPress.com Custom Design upgrade. I've noted your question though and added it to our user suggestion list.

hnsaifi on "Adding Retina Graphics"

hnsaifi — Sat, 18 Feb 2012 10:08:20 +0000

Sorry I don't know more bout it but Javascript doesn't work here on WordPress.com.

pixelcounter on "Adding Retina Graphics"

pixelcounter — Sat, 18 Feb 2012 10:00:54 +0000

Hi,

I was wondering if it's possible to add alternative images (2x) for high-dpi displays, such as that of the iPhone 4 or upcoming iPad 3?

I've been googling around and people are using solutions like Java Script etc. for that, but which are beyond my skills.

Thanks!