Extra space added to color section top/bottom - Support | Kriesi.at

Viewing 16 posts - 1 through 16 (of 16 total)

Author

Posts
November 12, 2019 at 6:59 am #1155842

patricknh
Participant

Hi,
I have an issue I cannot solve that seems to have been introduced with an update as no changes have been made to the site for quite a long while!
All the ‘color section’ items now have extra top and bottom space/padding added to them. In the text version of the page builder there is an additional “min_height” attribute that I cannot seem to find anywhere?
But even in the case of a color section where the image is supposed to fill the space (the first on page / top image) the native image height size is larger than the ‘min_height’ by a pixel or 5 specified so that it appears that the image has been shrunk and no longer fits the space?
Any help in getting this back to how it was would be appreciated!
Thanks

PS- not sure if this is related but one of the top banner images (ftp://slcontractors.co.za//public_html/wp-content/uploads/2017/12/civilsite.jpg) does not appear in the media gallery/library but is present in the files and displays in the correct place (http://slcontractors.co.za/civils/)

November 12, 2019 at 1:12 pm #1155992
Rikard
Keymaster
Hey patricknh,

Please try the following in Quick CSS under Enfold->General Styling:
```
#fwcs .template-page {
  padding: 0 !important;
}
```
Best regards,
Rikard
November 12, 2019 at 1:24 pm #1156000
patricknh
Participant
Hey Rikard.
Thanks – that seems to have fixed all the header/top image panels but not the ones below it (especially noticeable on the /plant-hire-eastern-cape/ page – ie the panels with all the construction vehicles). How can I do the same for those panels? Using the web tools inspector you can see the extra padding on top/bottom.
Regards,
Patrick

*edit: ~~if I remove the #fwcs from the css then it applies to all of the panels so that sorts the problem! Not sure if this is the best solution because it has now removed even desirable spacing/padding!?~~
Think I have solved that top/bottom spacing by giving each panel the same #id (#phv) then your css code seems to work for all of them. But now I seem to have given myself more problems:

1. The panels have a one pixel grey top border – how do I remove that (again on that same page this is very clear)? The setting for top and bottom border in that section is “no border styling”.
2. The alignment of each column I do not understand – the EasySlider aligns to the top of the panel/column whereas the Special Heading & the Tab Table aligns in the centre vertically. How Can I force the EasySlider to align vertically next to the other column with Heading/Tabs?
- This reply was modified 5 years ago by patricknh. Reason: New information
November 13, 2019 at 6:01 am #1156282
Rikard
Keymaster
Hi,

Thanks for the update. Try this CSS as well to remove the extra space and border at the bottom:
```
#tlb .template-page {
  padding: 0 !important;
}

.avia-section {
  border-bottom: none;
}
```
The EasySlider doesn’t have top padding while the headers do, do you want to add padding to the top of the sliders globally? Otherwise you could try to use the white space element.

Best regards,
Rikard
November 13, 2019 at 6:50 am #1156293

patricknh
Participant

Hi Rikard,
OK, thanks the spacing seems to be sorted. I have given every one I needed to remove the top/bottom spacing the same id# and that took care of it with your css.
The border is also gone now (it was just border-top not bottom) and I went with adding whitespace separator to sort out the easy slider alignment.

I still have three more issues to resolve that are eluding me! Please see link to illustration / explanation – its quicker to explain it graphically for me :)

Thanks,
Regards,
Patrick

November 13, 2019 at 12:37 pm #1156370
Rikard
Keymaster
Hi Patrick,

I wanted to check the backend for 1 and 2, but I can’t find the login page? I didn’t need to login for your other problems. Both of the texts seems to be wrapped in strong tags, so the the CSS of the strong tag will apply. You can override it with inline CSS though:
```
<strong style="color:#fff">Your text</strong>
```
On which page can I see problem 3?

Best regards,
Rikard
November 13, 2019 at 1:02 pm #1156384

patricknh
Participant

Oh sorry Rikard, my bad – the WP login page is shifted by ithemes security plug (bin private content).
>> On which page can I see problem 3? http://slcontractors.co.za/aggregate/
Font color issues are sorted thanks to your css :) Thanks!
Regards,
Patrick

November 14, 2019 at 5:50 am #1156646

Rikard
Keymaster

Hi Patrick,

Thanks for that. I see that you have the background position of the background image set to top left. What happens if you set it to middle?

Best regards,
Rikard

November 14, 2019 at 7:01 am #1156671
patricknh
Participant
Hi Rikard,
I tried that! Now its become even less predictable in behaviour. No matter what I select in positioning etc I cannot even get it back to the way it was (gap on right) – see screenshot. If I select anything other than Center, Center now it will not display the background image at all? Even if I choose Bottom, Right the background image does not appear at all now.

I am most confused now, not only how this all happened in the first place without changes to the site, but as to how to correct this? There are other situations on the site where this exact same method (background image, color section, text overlay) is working perfectly with the previous settings (‘image top left, no repeat’ – example on home page – panel with text left and image has view through circular pipe).

The only way I can alter this and fill that missing space is to create a new image which is 1130px wide not 1030 like the original. This seems to imply to me that the scale / fit settings are not working? Unfortunately I do not have the master photoshop image to adjust the elements for composition and the cropping is not ideal due to the scaling)

I think if there is no other solution I must modify the image in photoshop to get around this problem as I have already wasted too much of my time and your time on it.

Regards,
Patrick
- This reply was modified 5 years ago by patricknh.
November 15, 2019 at 5:24 am #1157056

Rikard
Keymaster

Hi,

Thanks for the update. I tried logging in so that I could check the settings but the login details are not working. Please check and verify.

Best regards,
Rikard

November 15, 2019 at 5:42 am #1157062

patricknh
Participant

Hi Rikard – sorry about that. I see that it only wants email address as login, not user name. Please try with my email.
Regards,
Patrick

November 16, 2019 at 4:27 am #1157388
Rikard
Keymaster
Hi,

Hmm, that’s strange. I can’t get it to work either. This CSS works when I try it in the browser though:
```
.page-id-6 #av_section_3 {
    background-size: cover !important;
}
```
Best regards,
Rikard
November 20, 2019 at 7:53 am #1158375

patricknh
Participant

Hi Rikard. I am unable to sort this out and I do not have the original art used to create this image so I have to make another arrangement. I can’t understand what went wrong but the settings for that color section either don’t work anymore or something unknown and that I cannot see from the page source is overriding them. Thanks

November 21, 2019 at 4:51 am #1158690

Rikard
Keymaster

Hi Patrick,

Thanks for the update, I’m not sure exactly what is going wrong either unfortunately. Are you going to use different graphics since you don’t have the original of the current one? Maybe it will work better with the new background image, let’s hope it does. If not then just let us know here in this thread and we’ll have another look at it.

Best regards,
Rikard

November 21, 2019 at 7:13 am #1158729

patricknh
Participant

Hi Rikard,
I have recreated that background to the exact width of the box and now it fills the space without any scaling and looks close enough that noone will notice!
Thanks, I think its okay to leave this as “worked around” if not solved now – way too much time spent already :)

November 21, 2019 at 7:42 pm #1158912

Jordan Shannon
Inactive Moderator

Hi,

I’m glad this was resolved. If you need additional help, please let us know here in the forums.

Best regards,
Jordan Shannon
Author

Posts

Viewing 16 posts - 1 through 16 (of 16 total)

The topic ‘Extra space added to color section top/bottom’ is closed to new replies.