Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • May 27, 2024 at 11:05 pm #1446766
    craig374

    I would like to insert a vertical pipe on the right side of the first footer column (i.e., acts as a separator between the first and second footer columns. You can see an example in the footer of the following website: https://hennessey.com/web-development/

    What is the easiest way to accomplish this?

    Again, I am only looking to insert the one vertical pipe. Don’t want it between every column.

    May 28, 2024 at 1:41 am #1446768
    Guenni007

    you can have it in between the first and second column:

    #footer .flex_column.first  {
  border-right: 1px solid rgba(255,255,255,.3);
}

    or more nearby the content of your first column:

    #footer .flex_column.first .widget {
  border-right: 1px solid rgba(255,255,255,.3);
  padding-right: 30px;
}
    May 28, 2024 at 5:17 am #1446786
    craig374

    Neither one of these codes appears to be working. I have flushed the cache. Still nothing.

    May 28, 2024 at 6:32 am #1446795
    Ismael

    Hi,

    Thank you for the update.

    We tested the css code above, and it seems to be working as expected. We may need to inspect the site to provide an appropriate modification. Please provide the site URL in the private field, and in the meantime, try toggling or temporarily disabling the Enfold > Performance > File Compression settings.

    Best regards,
    Ismael

    May 28, 2024 at 6:47 am #1446797
    craig374

    URL is below. File compression disabled. No change.

    May 28, 2024 at 7:03 am #1446804
    Ismael

    Hi,

    Thank you for the link.

    The border is visible when we checked. Please check the screenshot in the private field. To create some space between the widget and the border, please update the css code: 

    #footer .flex_column.first {
    border-right: 1px solid rgba(255,255,255,.3);
    padding-right: 50px;
}

    Best regards,
    Ismael

    May 28, 2024 at 7:23 am #1446806
    craig374

    Thank you. I can see the pipe now, but instead of there being space between the widget and the board (which would be great), it looks as if the text has simply spread to the right to fill up the space created. Thoughts?

    Also, how can I make the pipe be white like the surrounding text, etc.

    Finally, if I want the pipe to be shorter, how do I adjust the overall length of the pipe from both the top and bottom?

    May 28, 2024 at 11:24 am #1446830
    Ismael

    Hi,

    Finally, if I want the pipe to be shorter, how do I adjust the overall length of the pipe from both the top and bottom?

    To control the size of the border, you can replace the previous css code with the following code:

    #footer .flex_column.first:before {
    height: 80%;
    width: 1px;
    position: absolute;
    right: -20px;
    background: #ffffff;
    visibility: visible;
    top: 30px;
}

    Adjust the height property as needed.

    Best regards,
    Ismael

    May 28, 2024 at 2:46 pm #1446844
    craig374

    Perfect! This is exactly what I was seeking to achieve. Thank you. You can close the thread.

    May 28, 2024 at 4:29 pm #1446859
    Rikard

    Hi,

    Great, I’m glad that Ismael could help you out. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Insertion of Vertical Pipe in Footer Widget’ is closed to new replies.