This is an archived snapshot of W3C's public bugzilla bug tracker, decommissioned in April 2019. Please see the home page for more details.

Bug 14925 - Add a way to rotate background images with CSS
Summary: Add a way to rotate background images with CSS
Status: NEW
Alias: None
Product: CSS
Classification: Unclassified
Component: General (show other bugs)
Version: unspecified
Hardware: Other other
: P3 normal
Target Milestone: ---
Assignee: This bug has no owner yet - up for the taking
QA Contact: This bug has no owner yet - up for the taking
URL: http://www.whatwg.org/specs/web-apps/...
Whiteboard:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-11-25 04:04 UTC by contributor
Modified: 2011-11-25 15:46 UTC (History)
7 users (show)

See Also:


Attachments

Description contributor 2011-11-25 04:04:14 UTC
Specification: http://www.w3.org/TR/html5/
Multipage: http://www.whatwg.org/C#top
Complete: http://www.whatwg.org/c#top

Comment:
I would love to see a way to rotate background images with CSS3. As an artist
this would save large amounts of time.

When creating a high-end seamless tiling background, it takes skill and time.
If you want to have it on an angle, it's very difficult and can take many
hours. This is even more complex if the background needs to be geometric. I
have worked on backgrounds like that which took days to complete. 

By giving us a simple property in CSS to do this, we could create tiling
backgrounds and then let the browser rotate those images. Not only would it
save heaps of time producing these images, but it would allow us to reuse
background images that otherwise would seem mundane and repetitive.

Scan lines are a perfect trendy example. You could quickly create tiling lines
that are vertical or horizontal and then rotate them various degrees and
create different looks quickly on multiple sites.

I would opt for something very simple, such as:

background-rotate: 25deg;
background-rotate: -25deg;
background: url(images/bg.png) center center repeat 25deg;

this would follow the current syntax we are used to.

thanks and hope I this can be implemented before HTML5 and CSS3 are finalized.


Darren D'Agostino, Off the Rack

Posted from: 24.44.234.196
User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/534.51.22 (KHTML, like Gecko) Version/5.1.1 Safari/534.51.22
Comment 1 Michael[tm] Smith 2011-11-25 10:13:55 UTC
(In reply to comment #0)
> I would love to see a way to rotate background images with CSS3. As an artist
> this would save large amounts of time.
> 
> Darren D'Agostino, Off the Rack

CSS3 Transforms are what you want
Comment 2 Simon Fraser 2011-11-25 15:46:20 UTC
No, CSS Transforms don't allow you to transform the background independently.