help with div tags and *rounded corners*

[stephenmbell]

It isnt really rounded corners....

I have an image - basiaclly just a white box with a drop shadow, that will eventually hold some text and images.

I know how to do this with tables, but cannot seem to get it right with div tags.

What I have done already is, slice the image up into 1 image for each corner (50x30px) and 1 image for each side (50x1px).

In my head it makes sense to place the topleft, top

I want to place all of this together to replicate the box with a drop shadow and have the ability to put content in the box - but there is something I am not grasping?!?

Any help?

Hope this post was straight forward enough.

Thanks

sb

 

[vacunita]

You can;t really specify more than one background image for a DIV so you would actually need to create a construct of DIV's to hold your images.

Another option would be to have the div have specific dimensions that match those of your image, and then just add the entire image as background. If you need it to accommodate varying amounts of text, perhaps adding a overflow:scroll or auto property would help you as it makes the div scrollable.

Now if you tell us which scenario you want we can provide more help.

----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[stephenmbell]

I think, for the purpose of flexibility, I would like to create a construct of DIV's to hold my images. That is the way I think about it with td's so it makse sense to me -

I guess where I get confused is just understanding how to lay it out or nesting divs.


Thanks.

 

[ChrisHunt]

Take a look at

http://www.alistapart.com/articles/cssdrop2/

. If you decide that you do want to do rounded corners after all (top tip: try to ask questions that relate to the answers you're looking for), try

http://www.alistapart.com/articles/customcorners2/

.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd

 

[traingamer]

You could also look at a chapter from Dan Cederholm's book Bulletproof Web Design: Expandable Rows to see how he does expandable boxes. (I highly recommend the full book.)

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill

 

[Vragabond]

http://www.456bereastreet.com/archive/200609/transparent_custom_corners_and_borders_version_2/

I like this approach. It offers a lot of flexibility and you can do it with JS (less markup) or without (check links at the bottom).

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]