Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • June 14, 2017 at 8:05 pm #808185
    Camilla88

    Hi,

    I have a problem adjusting the pixels height on the whitespace/separator.
    It is on my front page.

    I would love some help with that simple issue :-)

    June 14, 2017 at 9:37 pm #808242
    Nikko

    Hey Camilla,

    Try adding this css code in Quick CSS (located in Enfold > General Styling):

    .home #after_full_slider_1 {
    display: none;
}

    Hope this helps :)

    Best regards,
    Nikko

    June 14, 2017 at 9:55 pm #808253
    Camilla88

    Hi Nikko,

    Thanks for looking at it.
    The CSS just removes the separator/whitespace entirely.

    In the separator/whitespace function, there is an option to enter a number that defines the pixel height.
    So the function is there. I just can’t make it work…

    Maybe you could login with my private data and look?
    I just find it hard to believe that writting a simple number in the option field like ’30’ or ‘-30’ can be done wrong :-)

    June 15, 2017 at 8:12 am #808434
    John Torvik

    Hi,

    You can manage this space with this custom CSS code:

    .template-page {
  padding: 10px !important; 
}

    Just change the values.

    Best regards,
    John Torvik

    June 15, 2017 at 12:27 pm #808540
    Camilla88

    Thanks, John, but it affected the look of the shop products as well on mobile. So I had to remove the CSS again.
    Can you add something to make it more specific to only affect the spacer/whitespace?
    That would be great.

    June 16, 2017 at 9:49 am #808897
    John Torvik

    Hi,

    You can put this custom code inside a media query with a specific width, like this:

     @media (min-width: 1170px) {
  .template-page {
    padding: 10px !important; 
   } 
}

    Best regards,
    John Torvik

    June 19, 2017 at 9:31 am #809686
    Camilla88

    Thanks, it worked.
    Can I add one that applies to mobile specific too?

    Also, will you fix the bug in the spacer, so this custom CSS is not necessary in the future?

    June 20, 2017 at 10:39 am #810289
    Victoria

    Hi,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 450px) {
  .template-page {
    padding: 10px !important; 
   } 
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    June 20, 2017 at 11:37 am #810302
    Camilla88

    Thanks, but when I add this my products below are no longer centered on mobile…

    June 22, 2017 at 12:44 pm #811478
    Victoria

    Hi Camilla88,

    Please remove the code I gave you before, and put this one instead:

    
@media only screen and (max-width: 450px) {
 .responsive #top #wrap_all #after_section_1 .container {
  width: 90%;
    max-width: 95%;
}
#after_section_1 .template-page.content  {
  padding: 0 !important;
}
}

    If you need further assistance please let us know.
    Best regards,
    Victoria

    June 22, 2017 at 2:49 pm #811564
    Camilla88

    Hi Victoria,

    Thanks for looking at it again. The code you most recently wrote does have any affect on the website.
    I appreciate all the attempt. But they all have a sideaffect that’s I would like to avoid.

    The spacer/whitespace block already has a field where I am guided to adjust the hight of the whitespace.
    That would be the ideal thing to do instead of different code.
    Is is a common error that the function does not work? And will it be prioritized in uocomming updates?

    Kind regards,
    Camilla

    June 26, 2017 at 9:30 am #812925
    Victoria

    Hi Camilla,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 450px) {
 .responsive #top #wrap_all #after_section_1 .container {
  width: 90%;
    max-width: 95%;
}
#after_section_1 .template-page.content  {
  padding: 20px !important;
}
#after_full_slider_1  .container, #after_full_slider_1  .content {
    padding: 10px;
  }
}

    You can adjust the spacing for the desktop view and it stays like that on mobile, if you want to adjust it for other screen sizes, you need css and media queries.

    If you need further assistance please let us know.

    Best regards,
    Victoria

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.