Jump to content


Photo
- - - - -

Media Box Padding

media box padding

  • Please log in to reply
3 replies to this topic

#1 dchetson

dchetson

    Advanced Member

  • Members
  • 41 posts
  • Framework Version:Pro
  • Country: Country Flag

Posted 14 May 2014 - 07:35 PM

I have four media boxes stacked in a column, but there is a significant amount of padding between them. I'd like to have the images be bigger and reduce the padding. If I make the images bigger then it throws off all of the alignment. Is there any way to reduce the padding around these boxes? Website is www.chetson.com



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 17618 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 15 May 2014 - 11:31 AM

Hi,

 

The image is reduced in size because you have set it to have an offset and a width of 4/12, make it 12/12 and remove the offset, this should make the image appear full width.



#3 dchetson

dchetson

    Advanced Member

  • Members
  • 41 posts
  • Framework Version:Pro
  • Country: Country Flag

Posted 15 May 2014 - 12:24 PM

But that still doesn't resolve the padding issue between images vertically.



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 17618 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 16 May 2014 - 09:31 AM

All MediaBoxes have padding/margin, if you want to reduce the gap between your images, you will want to reduce the padding for each MediaBox. You can do this by using 

 

However, in my opinion the best method would be for you to include all these images in one MediaBox, and use HTML. If you want to try the HTML method instead.

 

Add the following to one MediaBox:

 

 

Add the following to your custom CSS:

 

#site .list-unstyled {
padding-left: 0;
list-style: none;
}
 






Also tagged with one or more of these keywords: media box, padding