Title: Image widget container margin
Last modified: September 25, 2018

---

# Image widget container margin

 *  Resolved [durocketuk](https://wordpress.org/support/users/durocketuk/)
 * (@durocketuk)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/)
 * Hi all,
 * I use Site Origin Page Builder to lay out a pannel of pictures/text widgets.
 * I would like to decrease the margin around my Site Origin Image widgets, but 
   I can not understand their behaviour. It seems the image container is taking 
   up some space beyond the image actually displayed, but I can’t isolate the class
   and the css rules responsible for this.
 * The section is : [http://menartwork.fr/#collection](http://menartwork.fr/#collection)
 * I declared my Image widgets with class collection-img and tried the obvious, 
   to no avail :
 *     ```
       .collection-img {
       	margin: 0;
       }
       ```
   
 * Many thanks in advance for the help.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fimage-widget-container-margin%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 7 replies - 1 through 7 (of 7 total)

 *  Plugin Support [Andrew Misplon](https://wordpress.org/support/users/misplon/)
 * (@misplon)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10724177)
 * Hi 🙂
 * Please, try adding the following to your child theme CSS or Customize > Additional
   CSS and see if that helps:
 *     ```
       .so-widget-sow-image {
       	font-size: 0;
       }
       ```
   
 *  Thread Starter [durocketuk](https://wordpress.org/support/users/durocketuk/)
 * (@durocketuk)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10724291)
 * Hello,
 * Thank you for answer !
 * It works, but isn’t this kind of a hack ? I have the widget title displayed over
   the image on hover, and obviously setting font-size of the parent element to 
   0 hides it.
 * Actually I don’t understand why displaying the title causes this margin around
   the widget.
 *  Plugin Support [Andrew Misplon](https://wordpress.org/support/users/misplon/)
 * (@misplon)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10724315)
 * Hi, sorry I missed the text. Unfortunately, we don’t have much time to assist
   with custom development but do our best to help when able.
 * Try removing the rule I sent previously. Then add:
 *     ```
       .so-widget-sow-image {
       	position: relative;
       }
       ```
   
 * Finally, locate this rule: `.collection-img .so-widget-sow-image .widget-title`
   and change it from `position: relative` to `position: absolute`.
 *  Thread Starter [durocketuk](https://wordpress.org/support/users/durocketuk/)
 * (@durocketuk)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10730581)
 * Andrew,
 * Fantastic, it works !
 * Could you please give a hint into what happens ?
 * I had to set the position of the image title to relative because I use a css 
   trick to overlay the image title over the image on mouse hover :
 *     ```
       .collection-img .so-widget-sow-image .widget-title {
       	position: relative;
       	transform: translateY(-300px);
       ```
   
 * If position is set to absolute, then the title spanned the whole page.
 * Now setting the parent div position to relative solve the problem, but I admit
   I have no clue why…
 * Many thanks for your help !!
    -  This reply was modified 7 years, 8 months ago by [durocketuk](https://wordpress.org/support/users/durocketuk/).
 *  Plugin Support [Andrew Misplon](https://wordpress.org/support/users/misplon/)
 * (@misplon)
 * [7 years, 8 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10738794)
 * Super, glad that helped. By making the parent container relative and the child
   absolute we’re positioning the child absolutely within the parent. So top: 0,
   for example, will be top of the container we just set to relative. We’re basically
   setting the boundaries for the absolute element to use. I’m sure there are much
   better explanations of this elsewhere. Perhaps that gives you a starting point
   🙂
 *  Thread Starter [durocketuk](https://wordpress.org/support/users/durocketuk/)
 * (@durocketuk)
 * [7 years, 7 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10756387)
 * It does, thank you for the support !
 *  Plugin Support [Andrew Misplon](https://wordpress.org/support/users/misplon/)
 * (@misplon)
 * [7 years, 7 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10756969)
 * For sure 🙂 All the best.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Image widget container margin’ is closed to new replies.

 * ![](https://ps.w.org/siteorigin-panels/assets/icon.svg?rev=2556869)
 * [Page Builder by SiteOrigin](https://wordpress.org/plugins/siteorigin-panels/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/siteorigin-panels/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/siteorigin-panels/)
 * [Active Topics](https://wordpress.org/support/plugin/siteorigin-panels/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/siteorigin-panels/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/siteorigin-panels/reviews/)

## Tags

 * [margin](https://wordpress.org/support/topic-tag/margin/)

 * 7 replies
 * 2 participants
 * Last reply from: [Andrew Misplon](https://wordpress.org/support/users/misplon/)
 * Last activity: [7 years, 7 months ago](https://wordpress.org/support/topic/image-widget-container-margin/#post-10756969)
 * Status: resolved