Row Padding


#1

How do I reduce the row padding, especially when not on the front page so that the white space between the header image and the first row isn’t so significant?

Thanks!


#2

Hello,
maybe you can try add this code using custom css plugin:

.page-wrap {
  padding-top: 25px;
}

you can decrease or increase the value of the padding-top in above


#3

Doesn’t seem to work.

http://nffunctionalperformance.com/main/about/

Want to reduce the space at the top between the header image and the “About” text. Page is built with a row with a text widget inside of it.


#4

You’ve set your header image height to 450px and you’ve also set it to contain. Simply set a smaller height.


#5

Even as cover the white space would remain the same, actually playing with the setting Awan gave me didn’t move the test up or down at all.


#6

*Update

I see what you mean Vlad by the 450px height. Is there a way for the image to dynamically adjust its height depending on screen resolution?


#7

Well sorry to have bothered you guys, found the row padding under row theme sub menu …

Question still stands for the header image though if it’s possible. Thanks!


#8

Sure, you can add some media queries to set different heights for different resolutions. Use this please and adjust as you see fit:


@media only screen and (max-width: 991px) {
   .header-image {
       height: 300px !important;
  }
}

You can copy the code above multiple times if you need more breakpoints.
Though I see you switched to Revolution Slider at the moment.


#9

Yeah thanks for the help!

Seems like Revolution Slider solves my problem! :slight_smile: It re-scales without keeping a fixed height so the content adjusts accordingly.

Thanks again for the help and sorry for the trouble, I’m sure I’ll have more questions eventually!