...

View Full Version : Rounded Corners Problem.



IHMUN
12-16-2007, 06:05 AM
Well, I finally applied my layout I've been designing for my site to my forums. All was going well until I tried to make rounded corners for the head of my tables. I was attempting this effect with nested divs, but instead of doing like it should (creating rounded corners), it went all over the place.

Any help?

Link to problem (http://www.bbmodding.com/community/#cat_head)
Link to CSS (http://www.bbmodding.com/community/styles/subsilver2/theme/stylesheet.css)

By the way, both the template HTML and CSS validates fine.

effpeetee
12-16-2007, 01:19 PM
Well, I finally applied my layout I've been designing for my site to my forums. All was going well until I tried to make rounded corners for the head of my tables. I was attempting this effect with nested divs, but instead of doing like it should (creating rounded corners), it went all over the place.

Any help?

Link to problem (http://www.bbmodding.com/community/#cat_head)
Link to CSS (http://www.bbmodding.com/community/styles/subsilver2/theme/stylesheet.css)

By the way, both the template HTML and CSS validates fine.
I cannot help you with tables, I don't use them; but the url following is about rounded corners and there others in the "Sources file in my signature,

http://www.html.it/articoli/nifty/index.html

Frank

http://exitfegs.co.uk/Sources.html

IHMUN
12-16-2007, 05:19 PM
The problem is not table based at all. The nested divs are supposed to rest above the table.



<div class="cat_head">
<div class="cat_head_right">
<div class="cat_head_left" align="center">
<span style="white-space:nowrap;"><a href="./index.php?mark=forums&amp;sid=0d5a8588eca41362f429e562ff0d6373">Mark forums read</a></span> </div>
</div>
</div>

IHMUN
12-16-2007, 05:38 PM
Ok, Im close to having it working. All I have left is to get the right corner and I should have it.

IHMUN
12-16-2007, 07:54 PM
Got it working 100&#37;, now I just need a bit of help removing the white space between the round corners and table.

me2
12-17-2007, 10:46 AM
use
position: relative;
top: 15px;

to move the header up and down.. be careful to make sure it works in all browsers

IHMUN
12-17-2007, 10:35 PM
I really appreciate the good responses. Thanks everyone who posted help. It is finally working.

oldcrazylegs
01-16-2008, 01:47 AM
here is a cool tool that will generate the graphics and the div tags for you. all you have to do is provide the colors for the images.

http://www.neuroticweb.com/recursos/css-rounded-box/



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum