Tagged: , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 24, 2018 at 4:09 pm #945992
    DigitalEssence

    Hi,
    I’m trying to add an image to the top border of the socket but am struggling.

    I have tried using 

    #socket { 
    border: 140px solid transparent!important;
    -webkit-border-image: url(https://wildtreeadventures.com/wp-content/uploads/2018/04/socket-trees.png) 140 round!important; /* Safari 3.1-5 */
    -o-border-image: url(https://wildtreeadventures.com/wp-content/uploads/2018/04/socket-trees.png) 140 round!important; /* Opera 11-12.1 */
    border-image: url(https://wildtreeadventures.com/wp-content/uploads/2018/04/socket-trees.png) 140 round!important;
    border-bottom:0px!important;
    border-left:0px!important;
    border-right:0px!important;
}

    Which works on the W3 Website: https://www.w3schools.com/code/tryit.asp?filename=FQO4MITP5954 but not in Enfold.

    What I am trying to achieve is this:

    View post on imgur.com

    April 25, 2018 at 11:42 pm #946935
    Basilis

    Hey DigitalEssence,

    Can you please show us your web site?

    Best regards,
    Basilis

    April 26, 2018 at 11:50 am #947218
    DigitalEssence

    Hi Basilis,

    the address is: https://wildtreeadventures.com/

    thanks,

    Hedley

    April 27, 2018 at 11:08 am #947827
    Vinay

    Hi,

    You can instead try adding the background to #socket as a pseudo-element.

    #footer {
	padding-bottom:140px;
}
			
#socket:before {
	content:'';
	position: absolute;
	height:140px;
	top:-140px;
	left: 0;
	right: 0;
	background: url(https://wildtreeadventures.com/wp-content/uploads/2018/04/socket-trees.png) repeat-x 0 100%;   
}

    Best regards,
    Vinay

    April 27, 2018 at 4:10 pm #948013
    DigitalEssence

    Fantastic. Thank you. That is perfect.

    Just needed to add a !important to the #footer but it works a treat.

    April 27, 2018 at 6:17 pm #948073
    Vinay

    Hi,

    Glad we could help!
    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    To know more about enfold features please check – http://kriesi.at/documentation/enfold/
    Thank you for using Enfold :)

    Best regards,
    Vinay

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘How Do I: Add an image as a border to the socket footer?’ is closed to new replies.