Как сделать зубчатые барьеры у div класса

     <div class='container'> 
        <div id = 'left'> 
            <div id = 'div_logo'> 
                <img src="https://media\logotype.png" width="-1" height="-1" alt = "false|false"/> 
            </div> 
 
            <div id = 'left_div' style = 'text-align: left;' id = 'left_table'> 
                <div id = 'left_div'> 
 
                    <h1 id = 'hello_ever'>Hello everyone!</h1> 
                     
                    <p id = 'list'><b id = 'list_dec'>∙</b> MayBe - this is major company, which creates a lot of subsidiaries alimed at improving the environment</p> 
                     
                </div> 
            </div> 
        </div> 
 
        <div class='right_div' id = 'right_table'>  
            <div id = 'right_div'> 
                <div id = 'menu_out_div'> 
 
                    <div id = 'menu_div'> 
                        <button id = 'btn_menu'><img src="https://media\menu.png alt=menu" width="-1" height="-1" alt = "true|false"/></button> 
                        <div id = 'menu_div_content'> 
                            <p>1 пунк</p> 
                            <p>2 пунк</p> 
                            <p>3 пунк</p> 
                        </div> 
                    </div> 
                </div> 
            </div> 
        </div> 
    </div> 

 #left_div{ 
    background-color: rgb(0, 77, 36); 
    float: left; 
    width: 80%; 
    text-align: center; 
} 
 
#right_div{ 
    background-color: aliceblue; 
    float: right; 
    width: 20%; 
    justify-items: end; 
    height: 100vh; 
    position: absolute; 
    right: 0px; 
    text-align: center; 
}