Home › Forums › CSS › Absolute Positioning of an Image › Reply To: Absolute Positioning of an Image
July 25, 2017 at 12:36 pm
#257034
Atelierbram
Participant
I would try to absolute position a pseudo-element in relation to the search widget, and use that as a wrapper for a background-image. Something like:
.site-header .widget_product_search {
position: relative; /* to position the pseudo-element against */
}
/* pseudo-element: */
.site-header .widget_product_search:after {
content: "";
position: absolute;
z-index: 2;
right: -400px /* edit this value */;
top: -100px/* edit this value */;
width: 400px /* whatever the width of your background-image */;
height: 200px /* whatever the height of your background-image */;
background-image: url(path/to/background-image.jpg);
background-repeat: no-repeat;
background-position: center center;
}