How to code an arrow using css

Question

Hi guys I\'m trying to code an arrow like this in css, I\'e viewed examples on codepen, but now I\'m thinking whether it is actually possible?

Answer 1

An arrow in itself is created from an equilateral block of 0 height and width (with only the borders making up the visible element). And then you only show the left border to have a right arrow, the right border for the left arrow and so on and so forth.

https://css-tricks.com/snippets/css/css-triangle/

As far as adding the lines it's a matter of 0 height block elements and the required width for size of horizontal lines and 0 width and the required height for vertical lines.

I went ahead and created the following CSS

    
        
            
            
        
        
            
            
Right
            
Right
            
Right

            
Down
            
Down
            
Down

            
Left
            
Left
            
Left

            
Up
            
Up
            
Up


            

            

            


            

            

            


            

            

            


            

            

            


            

            

            


            

            

            


            
            

                
Up
                

            

            
Left
            


            

            
Right
            

                

                
Down
            

            
            

                
Up
                

            

            
Left
            


            

            
Right
            

                

                
Down
            

            
            

                
Up
                

            

            
Left
            


            

            
Right
            

                

                
Down
            
        
    

https://jsfiddle.net/2ykpwwgt/1/

For some reason in JSFiddle it doesn't parse like it does in my browser.

Well, you got an idea and something to play with with one method