if triangles are made with borders, how i can put a border in one triangle?

.arrow {
    border:40px solid transparent;
    border-bottom:40px solid black;



Recommended Answers

All 6 Replies

Member Avatar
#up-triangle {
   width: 0; 
   height: 0; 
   border-bottom: 120px solid blue; 
   border-left: 60px solid transparent; 
   border-right: 60px solid transparent; 
     <div id="up-triangle"></div>   

From: http://www.cssportal.com/css3-shapes/

diafol, i know how to do the arrow, Sorry if i did not explain myself enough my main language is spanish :P

What i would like to know is how to put a border in a triangle
In other words how to set a border to a border, since traingles are made of borders

Using this approach doesn't actually create a triangle, it looks like a triangle. So if you are looking for a way to make a triangle that has a "border" instead of a solid color triangle, using this same approach, create two triangles of different colors and one smaller than the other. Then position the smaller one to be placed in the center of the bigger one giving you the effect of one traingle with a border.

Thanks got the idea, but are u saying that theres others way to create a triangle in html/css? if so, how?
Very thanks!

HTML and CSS alone, you are limited. Introducing javascript will provide additional methods.

You can use SVG to create a triangle. SVG tags can be styled using CSS.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, learning, and sharing knowledge.