Positioning images in four corners of box

[Peter Cartwright]

Positioning four corner images in a stretchable box is possible using
a table. But can it be done in CSS?

[Jim Dabell]

Peter Cartwright wrote:

Positioning four corner images in a stretchable box is possible using
a table. But can it be done in CSS?

<URL:http://www.albin.net/CSS/roundedCorners/>

--
Jim Dabell

[Steve Fulton]

Peter Cartwright wrote:

Positioning four corner images in a stretchable box is possible using
a table. But can it be done in CSS?

As long as the "stretchabl e box" is a positioned element:

img.topleft {
position:absolu te;
top:0;
left:0;
}
img.topright {
position:absolu te;
top:0;
right:0;
}
img.bottomleft {
position:absolu te;
bottom:0;
left:0;
}
img.bottomright {
position:absolu te;
bottom:0;
right:0;
}

--
Steve

All truths are easy to understand once they are discovered;
the point is to discover them. -Galileo Galilei

[Lauri Raittila]

In article <b6************ **************@ posting.google. com>, Peter
Cartwright wrote:

Positioning four corner images in a stretchable box is possible using
a table.
Not unless you use some extra markup.
But can it be done in CSS?

Yes. You still may need extra markup though. Example:
http://www.student.oulu.fi/~laurirai...t/test022.html
(whiout meaningless markup)

The advantage on CSS way is that you can use meaningless (div, span)
extra markup, with table you need to use meaningful (td, tr) markup for
wrong purpose.

There is something on
http://www.webweaver.org/dan/css/corners
But IMHO none of the methods is good. All of course better than doing it
with tables.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

[Peter Cartwright]

Lauri Raittila <la***@raittila .cjb.net> wrote in message news:<MP******* *************** **@news.cis.dfn .de>...

There is something on
http://www.webweaver.org/dan/css/corners
But IMHO none of the methods is good. All of course better than doing it
with tables.

Not ideal as you say but the inline and background image method works
in my browser IE5.5 http://webweaver.org/dan/css/corners/fluidbox.html.

But I didn't understand the reason for declaring the inline style of
the image display:none then later display: block !important; ??

[Rijk van Geijtenbeek]

On 6 Aug 2003 08:44:42 -0700, Peter Cartwright <pe*******@yaho o.com> wrote:

Positioning four corner images in a stretchable box is possible using
a table. But can it be done in CSS?

If you don't have to get it working in MSIE, you can do it without extra
markup:

http://www.virtuelvis.com/gallery/css/rounded/
Works fine in Opera and Mozilla.
--
Rijk van Geijtenbeek