Jump to content

Custom Border images


Wakawaka

Recommended Posts

So I just have a quick question.

 

I am creating a website and wanted to make something a little different with more custom graphics.

 

What I am doing is creating an image to essentially become the new custom border. Is this best achieved using div tags around and between the content or best to create an image with both sides w/ specific px sets and use that as the background to the main content tags?

 

Thanks for the time and answers!

Link to comment
Share on other sites

Many people make an image as a square or rectangle of a certain size which has borders (perhaps shadows or color-graded) with nothing in the middle and then place the content in the middle, but this means a fixed width and height for the page.

 

You can split the borders into a horizontal top say 15px high, a horizontal bottom 15px high, place those in separate divs at top and bottom and then have 15px wide images floated left and right in the main content div so that it has flexible height.

 

If you create small corner images say 15*15px and float them into the corners you can then have flexible width and height by using small background-images for the horizontal and vertical sides which have repeat-x or repeat-y or an adequate length say 15*1000px.

 

See item 12 here:- http://w ww.wickham43.net/specialeffects.php which has flexible height but can be made to have flexible width.

Link to comment
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.
Note: Your post will require moderator approval before it will be visible.

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...