Forums
FAQ • Search • Login
Register
View unanswered posts | View active topics It is currently Thu Jul 31, 2014 1:35 pm

Board index » General Discussion

All times are UTC - 7 hours [ DST ]



Reply to topic  Page 1 of 1
  [ 3 posts ] 
Print view Previous topic | Next topic 
 A Headline With Its Own Style 
Author Message
grandpa

Joined: Tue May 29, 2012 8:16 am
Posts: 2
Post A Headline With Its Own Style
Most (all) my knowledge dates back to html3 and the early table-infected times - So I have a lot of 'catching up' to do 8^)

Unfortunately I have a problem which cannot wait for my pretty slow progress:

As a newcomer, [img] is OFF so I can't show you directly but I want to make a CSS3/Pie Box with round corners AND a headline with its own style like box no. 2 on ruzee.com

since it shall work in IE too I thought I would start asking for help around here.

Pls. bear with me and write as grandpa-friendly as possible :)
Tue May 29, 2012 9:10 am
Profile
grandpa

Joined: Tue May 29, 2012 8:16 am
Posts: 2
Post Re: A Headline With Its Own Style
I could add that so far I have googled my way to something like

Code:
<div class="boxborderradius">
    <div class="header">Title text</div>
    <div class="content">content goes here</div>
</div>


where

Code:
.boxborderradius {
   border:1px solid #dadada;
   border-radius:15px;
   -moz-border-radius:15px;
   -webkit-border-radius:15px;
   -o-border-radius: 15px;
   }
.header {
   background: none repeat scroll 0 0 #F5F7F6;
   height: 25px;
   padding: 4px 10px 0;
   text-align: left;
   border-radius:15px;
   -moz-border-radius:15px;
   -webkit-border-radius:15px;
   -o-border-radius: 15px;
   }
.content { width:auto; }


But will the header border only round on the two top corners?!?
Tue May 29, 2012 11:39 am
Profile
Tonttu

Joined: Sat Aug 21, 2010 11:12 am
Posts: 223
Post Re: A Headline With Its Own Style
grandpa wrote:
But will the header border only round on the two top corners?!?


You can select which corners to round and how much: http://css3pie.com/documentation/suppor ... der-radius

Quote:
Only the shorthand version is supported; the longhand border-top-left-radius etc. properties are not. The shorthand syntax does support different radii per corner, though:

border-radius: 5px 10px 15px 20px; (top-left, top-right, bottom-right, bottom-left).

_________________
PIE needs more community support persons! Time is money, which means you can fund PIE development by answering support questions.

Wed May 30, 2012 5:13 am
Profile
Display posts from previous:  Sort by  
Reply to topic   Page 1 of 1
  [ 3 posts ] 

Board index » General Discussion

All times are UTC - 7 hours [ DST ]

Who is online

Users browsing this forum: Baidu [Spider] and 2 guests

You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.