Wedge

Public area => The Pub => Topic started by: MultiformeIngegno on February 7th, 2012, 08:06 PM

Title: Table/iFrame with image as border
Post by: MultiformeIngegno on February 7th, 2012, 08:06 PM

How can I achieve this with CSS?
(http://img201.imageshack.us/img201/6166/tableao.jpg)

I tried with background-image with no luck so far.. :(

Title: Re: Table/iFrame with image as border
Post by: Dr. Deejay on February 7th, 2012, 08:56 PM

Is this(http://www.css3.info/preview/border-image/) what you are looking for?

Title: Re: Table/iFrame with image as border
Post by: MultiformeIngegno on February 7th, 2012, 09:08 PM

It works only with Safari (I tried with Chrome and Firefox latest versions with no luck)..

Title: Re: Table/iFrame with image as border
Post by: Nao on February 7th, 2012, 09:10 PM

Best use pseudo selectors like :before and :after for that. Only ie6 doesn't support them. :)

Title: Re: Table/iFrame with image as border
Post by: Norodo on February 8th, 2012, 01:30 AM

Quote from MultiformeIngegno on February 7th, 2012, 09:08 PM

It works only with Safari (I tried with Chrome and Firefox latest versions with no luck)..

Did you remember the prefixes?

http://caniuse.com/#feat=border-image

Also appears you can only use shorthand.

Disregard. I dun goofd.

Title: Re: Table/iFrame with image as border
Post by: Nao on February 8th, 2012, 07:38 AM

Really, :after and :before are best. I'm on my PC now so I can post the link:

http://nicolasgallagher.com/css-background-image-hacks/

Title: Re: Table/iFrame with image as border
Post by: MultiformeIngegno on February 13th, 2012, 02:43 PM

Thanks Nao, I managed to achive exactly the table shown at the first post! ;)
Those tags are quiet easy to use. :cool:

The only problem I have is that if I use overflow-y:scroll (I want a vertical scrollbar) the image disappears (because it's "inside").. :(

Title: Re: Table/iFrame with image as border
Post by: Nao on February 13th, 2012, 03:07 PM

Did you try auto instead of scroll?