IMAGE as border??? can it be done???

[freshmen]

good day to all!


can i issue an image as a border? if so, how/what is the codes in CSS thanks!

[mcepeda]

In CSS1 and CSS2...no can do. In CSS3, it's possible with the border-image property. You might want to read this, so you can understand it.

Just so you know, it doesn't work yet. :S

The easiest way to use an image as a border is to wrap the area you want in a DIV or other container, assign a padding to the container, and apply a tiling background to the container.

Example:

Code: Select all

//css
div {
background: #f00 url(frame_bg.png);
padding: 20px;
width: 100px;
}

//html
<div><img src="my_picture.png" width="100" height="100"></div>

There are other (albeit, more complicated) ways to use images as borders, of course.

[freshmen]

yeah i already did that. thanks

[mpourkos]

i didn't get that. I want a a frame over an image or [youtube] video and i would like to make it look like the image i uploaded. How could this be done? Is there any module or plug in that i could use?

[armatoste]

You could create two divs. One as the main content and another with your image as background bigger than the other one. Something like this:

Code: Select all

<div style="width: 100px; height: 100px; background: url("HERE YOUR URL") repeat;">
   <div id="width: 90px; height: 90px; margin: 5px 0 0 5px;">
      // Your content
   </div>
</div>

I guess you got it. Here is a wider explanation: series ly.