Posts

Showing posts with the label SVG

CSS3 Transition Rotating Does Not Fit

Awhile back I created an application to display some data inside of a table but after it was all said and done I was then asked if I could make it so the information could be rotated. With that I thought I could easily implement this using CSS3 transition and rotate on the x-axis but I would much prefer doing this in a canvas.Which make this a great solution but current my content is displayed in a table and isn't scalable this way, so it doesn't help for me. I could also use d3js, from what I've seen in the examples it could be easier to implement.
I did find that some created a solution to handle the issue with Css3 transition, where as you rotate the element the content around it does not adjust appropriately. There is reasons behind why this happens, but no proper way to handle it with just css. As you rotate a given element it does not remove or change any of the styles attached to it. So margin, padding and whatever else will still be applied but also as you rotat…