border frame as image frame

webactor

Avatar: webactor

2008-09-30 08:04

Hi there

Is it possible to change the border frame into a border image.
Ex. in the line (main container area) i have this:
#main{width:750px;margin:0 auto;border:6px solid #332;text-align:left;}

I changed it to:
#main{width:992px;margin:0 auto;border-left:6px Solid #3F383A;border-right:6px Solid #3F383A;text-align:left;}

It create a border left and right my site.

But instead of a border frame, i would like to have a small border image.
I made a 10x10 px image that fades from black to the gray i use as BG.

it will look like the site is at bit lifted up, because of the fade image on the sites
But i just cant figure out how to inseart the img tags, to define this img border.
does anybody have a clue ?

Hope you can help me

C yaa | Cheers

-----------------------------------------------------------
Kimo Webactor.dk

» Quick.Cms v2.x

Makaron

Avatar: Makaron

2008-09-30 09:23

You have to use background: url('image.gif') left top repeat-x; attribute for top "border" and just a little bit changed style to bottom.. You can add two fields in templates/container.tpl and declares styles to it or just use existing.. The best way I think is to use #container block for top border and body tag or #footer to bottom..

webactor

Avatar: webactor

2008-09-30 12:52

Hi Makaron

And super duper thanks. .. ha ha
But i am not sure that i really understand .. sorry

I see what you mean, but is there not a way to change the
border into a frame image ?

could you maybe give my and ex. on how to use the
"#container block for top border and body tag" Or guide me to and ex.

Well once again Makaron .. Thanks :)

Hope you can help me

C yaa | Cheers

-----------------------------------------------------------
Kimo Webactor.dk

webactor

Avatar: webactor

2008-10-01 10:06

Okey i think i found a way.

My main line in templates/container.tpl - is looking like this.

#main{width:1015px;margin:0 auto;border:opx solid #000;background:url('img/shadow3.png') repeat;padding:5px;text-align:left;}

then just make a png file/image with the width of ex. 1020px
put it in templates/img

Well i dont think its the right way to do it, but i works for me :)

C yaa | Cheers

-----------------------------------------------------------
Kimo Webactor.dk

Makaron

Avatar: Makaron

2008-10-01 10:09

I think You want this effect: http://www.echoslaska.pl/makaron/Quick.Cms.Lite_v2.2_image_border/ (I prefer show than talk about it unfortunately my english isn't fluent) If it is good for You just look at code in http://www.echoslaska.pl/makaron/Quick.Cms.Lite_v2.2_image_border/templates/default.css

Back to top
about us | contact