I have a block of something defined in a css tag, eg.

<span class=stick>this is one example of code</span>

<span class=stick><table ...> ........</table></span>

What I would like is that in the top left and bottom right I can but
an icon. The effect I'm trying to acheive is to have corners at these
two edges. Any ideas how I can acheive this effect just using
CSS/DHTML?

I can supply a graphic example of the look i'm after if it helps?

---

Request for Question Clarification by lot-ga on 02 Aug 2002 16:05 PDT

--------   
|
|


                                |
                                |
                      --------   

Hello, you want to create a shape like above?
Two corners top left, and bottom right,
and to draw this using CSS/DHTML/HTML?
regards lot-ga

---

Clarification of Question by ideasmerchant-ga on 03 Aug 2002 05:48 PDT

Yea you've got what I'm after.

I've been trying to create this affect in CSS but I can only put one
image in the style I've created.

I would like to continue to use CSS as its easy for me to apply the
formatting, and it dosen't take up too many bytes. Size of code is
important as I will be using the code to style dynamicaly created
pages which could have many-many of these elements.

---

Clarification of Question by ideasmerchant-ga on 03 Aug 2002 12:29 PDT

Unfortunatly the hybred solution isn't suitable. I need the code to be
self containing - that is a pure CSS (and or dhtml). There isn't the
bandwidth avaliable to have extra table code.

One possible solution I've just thought of is to double wrap the text.
One tag gives the top-left graphic, the other tag gives me the bottom
right. There must be a better way ????

If you're after what I think you are, you could have the background
image for the site be the bottom right corner (like an image of a page
curl or something) with code like

body { 
  background-image: url("bottomright.jpg"); 
  background-position: bottom right; 
  background-repeat: no-repeat;
}

And then to get the top left corner you could stick a table whose
position is at the very top and very left of the page with the image
for the top-left corner as its background, like this..

<table border=0 cellspacing=0 cellpadding=0 background="topleft.jpg"
style="background-repeat: no-repeat; background-position: top left;
position: absolute; left: 0px; top: 0px;">

That way the body background is in the bottom right of the page and
that table is in the top left, giving the effect I think you're
looking for (unless I read what you said wrong).

I see what your getting at. But it won't get the effect I'm after.
 _
| d kjhdfkjhdkjhfkjhs kjh fhd khf dsh fkkds jfh
dskfhkjdshfkh dkfjh _|

The above illustrates why a TABLE solution won't work. The formatting
has to be done by either CSS or DHTML only.

I had hoped the someone might be able to show how to get two images
defined into a single CSS tag...?

I've looked into this problem some more and I think DHTM will be
necessary to get the BOTTOM RIGHT image in place.

To answer this questions I think all you will need to be able to do is
show the formatting top and bottom right (in line with last element of
text not square with edge).