can't limit image width!

[boudewijnt]

hi, new to this forum so hopefully I do this right and you can help me; I am creating a website and have an image that i want to use as type of separator; regard to http://www.nieuw.astridtimmers.nl/nl it is about the horizontal lines with the heart in the middle. The image is >2000px wide, so it will work in most window sizes. The idea is to limit the width to the bootstrap container width; somehow with the first separator it works, and with the second it doesn’t. Anyone know what I am missing out here?
thanks,
Boudewijn

[vulkanus]

Hi,

I don´t know if it ´s what you want, please:

.container {
margin: 0 auto;
margin-top: 25px; <—–
}

[vulkanus]

I figure it out:

Try also this

.hartje-na::after {
background: url(../images/ruler-01.png) no-repeat center bottom;
height: 30px;
width: 50%; /* reduce here */
position: absolute;
left: 0;
right: 0;
margin-top: 10px;
margin-bottom: 10px;
content: “”;
left: 0;
right: 0;
margin: auto;
}

.home-slider {
/* position: relative; remove this*/
z-index: 1;
}

if you prefere one line, remove this:

.hartje-na {
/* margin-bottom: 20px; remove this*/
}

for the last line :

.hartje-voor::before {
background: url(../images/ruler-01.png) no-repeat center bottom;
height: 30px;
width: 50%; /* reduce here */
position: absolute;
left: 0;
right: 0;
margin-top: -10px;
margin-bottom: 10px;
content: “”;
margin: auto;
}

.uc-grid-front {
box-sizing: border-box;
margin-top: 50px;/* add this */
}

This is what you want?
sorry if is not

[JeroenR]

It is because the first container has position relative because of the home-slider class. Maybe you can set all containers to position: relative;. That would set the hartje-na DIVs relative to the containers.

[boudewijnt]

Hi JeroenR, that will do the trick! Checked in dev-tools and will implement tonight. Thanks a lot!

Vulkanus, your answer was in the same area but the I intended it the other way around (actually needed the relative position). So at first I didn’t see how to work with your solution but after Jeroen’s answer could see your way of thinking.

[Author]

Posts