Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Zach Saul
11,156 PointsIs there a way to create slanted lines in CSS or HTML that doesn't yield a pixelated result?
I tried using webkit linear gradients and color stops to achieve slanted CSS lines but the result was pixelated and looks like it's of poor quality from the user's perspective.
this problem seems so simple I'm sure theres a solution to it - wondering if anyone has insight or suggestions.
2 Answers
Robert Manolis
Treehouse Guest Teacherthe thing to do is just to experiment. try different variations and see how they load in different browsers and different devices. Variety is the spice of life they say.
if my answer helped at all, please feel free to mark it as best answer or just give me a point or whatever. Thanks and happy coding.
Robert Manolis
Treehouse Guest TeacherThe lines are created by pixels, so depending on the image and the resolution, pixels can sometimes rear their ugly shapes.
Sometimes shrinking the image can reduce that pixelated effect.
creating your gradiation images in something like adobe illustrater or inkscape and then applying them as background images in your css might yield better visual results.
Zach Saul
11,156 Pointsyeah, i always new that was an option, I just was hoping there was a way to do it in the CSS to avoid cumbersome images (that make the site load slower).
Zach Saul
11,156 PointsZach Saul
11,156 Pointssorry, I didn't mean to sound snarky at all, i very much appreciate it. I was just wondering if there was a way to di it in the CSS -
im a tad confused by one thing you said -
if I use linear gradients to achieve my effect what do you mean when you say change the size?