I'm sorry, I have very little experience with web design, but is this the supposed way to create a triangle? It seems weird there would be no way to build shapes with primitives.
Animation to Explain CSS Triangles
11–20 of 107 posts
Re: Animation to Explain CSS Triangles
#12Re: Animation to Explain CSS Triangles
#13Does this mean if you create a 100px high triangle, it has 100px of invisible padding on top?
Re: Animation to Explain CSS Triangles
#14I'm sorry, I have very little experience with web design, but is this the supposed way to create a triangle? It seems weird there would be no way to build shapes with primitives.
Re: Animation to Explain CSS Triangles
#15I'm the only one here that although thinks it is a cool presentation fells sad about how a triangle needs to be described as a very broken rectangle?
In fact, I think it's awesome that a triangle can be created from a "very broken rectangle", along with many other hacks that make this simple language quite powerful.
Re: Animation to Explain CSS Triangles
#16I'm the only one here that although thinks it is a cool presentation fells sad about how a triangle needs to be described as a very broken rectangle?
I disagree. It would be sad if a triangle couldn't be created in CSS at all. In fact, I think it's awesome that a triangle can be created from a "very broken rectangle", along with many other hacks that make this simple language quite powerful.
Re: Animation to Explain CSS Triangles
#17Earlier quoted context omitted.
I disagree. It would be sad if a triangle couldn't be created in CSS at all. In fact, I think it's awesome that a triangle can be created from a "very broken rectangle", along with many other hacks that make this simple language quite powerful.
I really hope you're being sarcastic. Sometimes these things have a way of whooshing over my head...
Re: Animation to Explain CSS Triangles
#18Eg. a triangle pointing down:
.triangle-down {
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-top: 7px solid #444;
}Re: Animation to Explain CSS Triangles
#19Sweet. Thanks for making this. It'd be awesome if you could extend the animation and show examples of complex shapes you could make with triangles.
Re: Animation to Explain CSS Triangles
#20Earlier quoted context omitted.
I really hope you're being sarcastic. Sometimes these things have a way of whooshing over my head...
Why would he be when it's mostly cross-browser? It means you dont need to draw the triangle and throw it into a .png or your sprite then deal with all that crap. You have a triangle that you can use to point at things AND you can modify the borders to change the size of that triangle on the fly. Yay.
Don't get me wrong, I love dirty hacks, just not if they're forced onto me. I guess in a couple of weeks stockholm syndrome will set in, and I'll love it, but for the beginner, especially if you're moving there from either design (What, I need to hack things to get this typography display right?), or programming (What, I need to learn a whole bag of tricks to get the site to style properly?), CSS seems like that dirty pimp down the street to you. Yeah, he's fabulous, but he always wants you to do tricks for him.