Try to search your question here, if you can't find : Ask Any Question Now ?

Resize and reposition child divs with resizing of parent column

HomeCategory: stackoverflowResize and reposition child divs with resizing of parent column
Avatarjulie asked 3 months ago

I have a child div that is a colored triangle:

 .shape-triangle {
     width: 0;
     height: 0;
     border-left: 25px solid transparent;
     border-right: 25px solid transparent;
     border-bottom: 50px solid $primary;
     position: absolute;
     top: 20px;
     left: 110px;

that is nested inside a Bootstrap column with a background image:

<div class="col-12 col-lg-6 text-center">
    <div class="shape-triangle"></div>
    <img src="assets/background.png" alt="Image">

It sits on top of a background image (a bunch of grayscale shapes):


When my screen/browser window is reduced in size, the image resizes but the triangle obviously doesn’t:


How do I get the colored triangle to remain proportional in size and position to the image?

1 Answers
Best Answer
AvatarFernando answered 3 months ago
Your Answer

2 + 6 =

Popular Tags

WP Facebook Auto Publish Powered By :