XHTML/CSS question: how to draw a curved box for a sidebar

vharishankar · 08-04-2005, 09:32 AM

I'm trying to design my Debian help page based on the design of the official www.debian.org site.

Of course, I wanted to make the sidebar with curved edges rather than flat. What is the best way to achieve this using purely CSS design with <div> tags?

Regards.

Mr. New · 08-04-2005, 10:51 AM

I would also like to know, but i would like to add that it is only curved in gecko based browsers (I think)

thorn168 · 08-04-2005, 05:16 PM

Hari,

I think you have create a gif image to get the curve effect and then use CSS to place the image where you want it on the page. Otherwise you may end up having to code pixel points to acheive the curve effect.

vharishankar · 08-04-2005, 07:51 PM

Yes, I tried using an image, but it doesn't work out well because images are fixed width and I need the sidebar to be resized according to the browser window width.

Any ideas?

Regards.

Mr. New · 08-04-2005, 08:24 PM

very bottom of debian.css

Quote:

#leftcol, #navbar, #navbar a, #navbar3, #navbar3 a {
-moz-border-radius: 15px;
/* this goes to the end as the css validator does not like it
will be replaced by border-radius with css3 */
}

so this only works in mozilla
i personally cannot wait till CSS3 is in all major browsers,web design will be fun.

vharishankar · 08-04-2005, 08:32 PM

Yes, thanks a lot. I did somehow feel that that was not an image at all. If it works only with Gecko-based browsers, too bad. I'm going to use it anyway. I don't think too many people with IE will be viewing my Debian site