Hi, Guest ~ Login or Register

Rounded Corners

Posted in Website Designing » Layouts and Templates - Sunday 23rd September 2007 at 5:10PM

Brad
Member

User Avatar

Joined April 2007
Posts: 85

Okay guys, I might have a good sense of colours, but damn; I cannot design rounded corners. I simply fail at every attempt.

What is your method of doing this? Any tips? Advice? Etc...

I know they're not useful everywhere, but sometimes it gives the layout flavor...

__________________________________
Brad Purchase
Programmer, Designer, and Apple Tart.

 

Replies (12)

Replied - Sunday 23rd September 2007 at 5:33PM [Post Link]

Alec
Super Moderator

User Avatar

Joined April 2007
Posts: 124

http://www.alecrust.com/playground/02/ was a little experiment I did a while ago. Doesn't work in IE 6 though. Apart from that it kicks ass.

__________________________________
My Personal Portfolio Site

 
Sponsored Link
Replied - Sunday 23rd September 2007 at 5:38PM [Post Link]

Will
Administrator

User Avatar

Joined October 2005
Posts: 129

I split the rounded corners into three sections:

1) Top (no-repeat)
2) Content (repeat)
3) Bottom (no-repeat)

It's tag soup, but it works. I then offset some margins so the content "fits" into the box and then I'm set.

__________________________________
Will Morgan
Freelance Web Developer
Next feature: How to fit 25 hours into a day!

 
Sponsored Link
Replied - Sunday 23rd September 2007 at 6:50PM [Post Link]

Tubby
Member

User Avatar

Joined July 2007
Posts: 47

I do the same as Will, it works very well.

__________________________________
All posts are my own opinion.

 
Replied - Monday 24th September 2007 at 6:56PM [Post Link]

Alex
Member

User Avatar

Joined July 2007
Posts: 31

I also do the same as the above :)

__________________________________
Aim2Break Records

 
Replied - Monday 24th September 2007 at 7:29PM [Post Link]

Alec
Super Moderator

User Avatar

Joined April 2007
Posts: 124

Can someone appreciate my invention? :p

__________________________________
My Personal Portfolio Site

 
Replied - Monday 24th September 2007 at 10:16PM [Post Link]

adam2z
Member

User Avatar

Joined October 2005
Posts: 113

or...<div id="TRcorner"><div id="TLcorner"><div id="BLcorner"><div id="BRcorner"><div id="Redge"><div id="Tedge"><div id="Ledge"><div id="Bedge">

Content

</div></div></div></div></div></div></div></div>


and then give the appropriate background images and positions with repeat on for edges (x or y depending on edge) and off for corners.

i think you may just find that the code is less... or not, im not sure. but it is guaranteed to hold together.

__________________________________

 
Replied - Monday 24th September 2007 at 10:45PM [Post Link]

Tubby
Member

User Avatar

Joined July 2007
Posts: 47

more than mine.

<div class="top"></div>
<div class="middle">MAX CONTENTAGE</div>
<div class="bottom"></div>


etc, etc

__________________________________
All posts are my own opinion.

 
Replied - Monday 24th September 2007 at 11:01PM [Post Link]

adam2z
Member

User Avatar

Joined October 2005
Posts: 113

cant make that stretch all ways though can you. and you have to set a fixed width with images. with mine it is 100% fluid.

__________________________________

 
Replied - Tuesday 25th September 2007 at 3:02AM [Post Link]

Xplicid
Member

User Avatar

Joined April 2007
Posts: 56

[QUOTE] adam2z said (24th September @ 22:01pm):

cant make that stretch all ways though can you. and you have to set a fixed width with images. with mine it is 100% fluid.



Coming from the Mr.Fixed-Layouts doode?

__________________________________
Go play in traffic. Thx. Luv ya.

 
Replied - Tuesday 25th September 2007 at 9:45AM [Post Link]

Will
Administrator

User Avatar

Joined October 2005
Posts: 129

[QUOTE] (Unsourced):

Xplicid said (25th September @ 2:02am):

[quote=adam2z;1190671284]cant make that stretch all ways though can you. and you have to set a fixed width with images. with mine it is 100% fluid.



Coming from the Mr.Fixed-Layouts doode?

Think before you post, Xplicid. Adam is talking about the way that you can stretch the content box (as opposed to the layout) in both the X and Y axis.

__________________________________
Will Morgan
Freelance Web Developer
Next feature: How to fit 25 hours into a day!

 
Replied - Tuesday 25th September 2007 at 9:27PM [Post Link]

adam2z
Member

User Avatar

Joined October 2005
Posts: 113

[QUOTE] (Unsourced):

Will said (25th September @ 8:45am):

[quote=Xplicid;1190685721][quote=adam2z;1190671284]cant make that stretch all ways though can you. and you have to set a fixed width with images. with mine it is 100% fluid.



Coming from the Mr.Fixed-Layouts doode?

Think before you post, Xplicid. Adam is talking about the way that you can stretch the content box (as opposed to the layout) in both the X and Y axis.[/quote]

which would also help in the fluid layouts that you accuse me of not making.

not to shabby in fixed layouts either.. they mean you can change the width at any time without screwing with images.

__________________________________

 
Replied - Tuesday 25th September 2007 at 9:51PM [Post Link]

Brad
Member

User Avatar

Joined April 2007
Posts: 85

I'm going to be redesigning my blog soon, and I think I'll try one (if not both) of these methods.

Thanks guys! I'll post updates...

__________________________________
Brad Purchase
Programmer, Designer, and Apple Tart.