Jump to content
tornator

Using an image as a border

Recommended Posts

Hellos! I'm having a problem with a border: What I want to do, is to create a line between my site title and my header image. It would be a bottom border for the title. I want to use an image instead of the normal lines, that you normally use. The image is a sort of a chain which I want to span through whole page. What I've tried out so far is:border-bottom: url("/mywebsite/wp-content/uploads/2012/02/chain.png") no-repeat scroll 0 0 transparent

Share this post


Link to post
Share on other sites

You can't use the background syntax for a border image. Border image has its own syntax: http://w3schools.com/cssref/css3_pr_border-image.asp It doesn't have the best browser support. At the moment you could create a new element and put it where you want the image to appear.

Share this post


Link to post
Share on other sites

By create a new element I meant to write this in your document:

<div></div>

Share this post


Link to post
Share on other sites

Uh, I've really no idea how to do this. I added the following above the header:

 <div id="chain" role="banner">    <a href="url(page/wp-content/chain.png)"></div>

This didn't work :D

Edited by tornator

Share this post


Link to post
Share on other sites

Something like this:>[CSS]>div#chain{height:5px; background-image:url('chain.png')}>

>[/b][code]<div id="chain"><!--Leave here empty--></div>[/code]

NB: Visit w3schools.com, learn HTML and use the 'do it yourself' button to see how things works!

Edited by eTianbun

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...