Jump to content


box with drop shadow


8 replies to this topic

#1 exacube

    Young Padawan

  • Members
  • Pip
  • 7 posts

Posted 01 February 2006 - 07:41 AM

how can i do this kind of box, with that drop shadow? , in CSS
Posted Image
i know that is not possible to put an image as border so...

Edited by exacube, 01 February 2006 - 07:54 AM.


#2 Xanderdude

    Jedi In Training

  • Members
  • PipPip
  • 453 posts
  • Location:The Netherlands
  • Interests:Radio controlled flying and Digital art,Web<br />And a little gaming if im bored

Posted 01 February 2006 - 08:36 AM

I think he created a image with the shadow and inserted that instead of dashed; ect. Kinda forgot my coding stuff :(.

#3 exacube

    Young Padawan

  • Members
  • Pip
  • 7 posts

Posted 01 February 2006 - 08:57 AM

View PostXanderdude, on Feb 1 2006, 08:36 AM, said:

I think he created a image with the shadow and inserted that instead of dashed; ect. Kinda forgot my coding stuff :(.

it's obvious that there is an image as an backgrouns or something like that; there is an image for each border, but how can i make it, i just can't create a box and positioning the four images like 1 to left,1 to top, 1 to bottom and 1 to right, so...how can i do this?

#4 syndrome

    P2L patient #4819

  • Twodded Staff
  • PipPipPipPip
  • 1,311 posts
  • Location:Nottingham, UK
  • Interests:Photoshop, Tennis, PS2, web design, CS:S

Posted 01 February 2006 - 09:06 AM

Take a look a deviantART's code they made every image thumbnail have a dropshadow using CSS :(

#5 greg

    Jedi In Training

  • Members
  • PipPip
  • 499 posts
  • Location:New York City
  • Interests:Fine art, web and graphic design, naval architecture, chess, and sports.

Posted 01 February 2006 - 12:59 PM

Exacube, the entire "box" is one image, not four seperate images for each border.

#6 rc69

    PHP Master PD

  • P2L Staff
  • PipPipPipPip
  • 3,827 posts
  • Gender:Male
  • Location:Here
  • Interests:Web Development

Posted 01 February 2006 - 04:09 PM

I'd recommend searching google for a bit. But you can also be lazy and take a look at the following link.
http://www.alistapar...cssdropshadows/

Edited by rc69, 01 February 2006 - 04:10 PM.


#7 exacube

    Young Padawan

  • Members
  • Pip
  • 7 posts

Posted 01 February 2006 - 08:21 PM

View Postgreg, on Feb 1 2006, 12:59 PM, said:

Exacube, the entire "box" is one image, not four seperate images for each border.

i've downloaded that site and there are four separate images; how can that be just an image?if so...how can i put some text over it?(excludin the possibility to make a box with fixed height)

thnks @rc69, i'll read that and see if it's whati'm looking for :blink:

Edited by exacube, 01 February 2006 - 08:33 PM.


#8 greg

    Jedi In Training

  • Members
  • PipPip
  • 499 posts
  • Location:New York City
  • Interests:Fine art, web and graphic design, naval architecture, chess, and sports.

Posted 01 February 2006 - 09:21 PM

If you want to put text over it, you can just make the image a background.

If you want the div to be expandable, you can make 3 images: top of the box with both corners; bottom of the box with both corners; and a horizontal slice of the middle. Then you can make 3 divs and make the images their backgrounds in appropriate order.

#9 exacube

    Young Padawan

  • Members
  • Pip
  • 7 posts

Posted 01 February 2006 - 09:29 PM

i just red that article but is not what i'm looking for; i want my box to have drop shadow on all it's borders;
i'm gonna search google deeper or i'm gonna use your sugestion @greg





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users