|
| |
|
|
curious monkey
Posts: 555
Joined: 4/28/2006
From: The lower handle of US
Status: offline
 |
Rounded..... - 7/10/2006 14:25:22
Using Stu Nichols technique that I brought up in this thread it's a pain to resize to a smaller box using margins .... i've tried to put it in a div and still nothing it seperates. very odd....
is there another way to do that?
_____________________________
I have a ringing in my head and no one to help me answer it
|
|
|
|
rdouglass
Posts: 9280
From: Biddeford, ME USA
Status: offline
|
RE: Rounded..... - 7/10/2006 14:35:24
I use a version of rounded corners that looks like this:
Markup:
<!--go button div-->
<div class="goBox">
<div class="goDiv1"></div>
<div class="goDiv2"><a href="#">GO!</a></div>
<!--corners for go cell-->
<div class="goBoxFirstCorner"></div>
<div class="goBoxSecondCorner"></div>
<div class="goBoxThirdCorner"></div>
<div class="goBoxFourthCorner"></div>
<!--end corners for go cell-->
</div>
<!--end go button div-->
CSS:
.goBox {
position:absolute;
top:158px;
left:240px;
height:30px;
width:45px;
padding:0px;
font-size:12px;
color:white;
font-weight:bold;
}
.goBoxFirstCorner {
position:absolute;
top:0px;
left:0px;
width:10px;
height:10px;
background: url(images/tl_tran.gif) 0 0 no-repeat;
}
.goBoxSecondCorner {
position:absolute;
top:20px;
left:0px;
width:10px;
height:10px;
background: url(images/bl_tran.gif) 0 0 no-repeat;
}
.goBoxThirdCorner {
position:absolute;
top:20px;
right:0px;
width:10px;
height:10px;
background: url(images/br_tran.gif) 0 0 no-repeat;
}
.goBoxFourthCorner {
position:absolute;
top:0px;
right:0px;
width:10px;
height:10px;
background: url(images/tr_tran.gif) 0 0 no-repeat;
}
.goDiv1 {
position:absolute;
left:0px;
height:10px;
background:#3399CC;
top:10px;
width: 33px;
padding-left: 12px;
margin-top:0px;
}
.goDiv2 {
position:absolute;
left:10px;
height:24px;
background:#3399CC;
top:0px;
width: 22px;
padding-left:4px;
padding-top:6px;
}
and this code is running on this sample page:
http://www.rogerdouglass.com/rhino/
to see the whole effect. It does use 4 gifs but can fit virtually any size box. The goDiv1 and goDiv2 are 'fillers' but IMO this is quite versitile.
Hope it helps.
_____________________________
Don't take you're eye off your final destination.
ASP Checkbox Function Tutorial.
| |
|
|
|
curious monkey
Posts: 555
Joined: 4/28/2006
From: The lower handle of US
Status: offline
|
RE: Rounded..... - 7/10/2006 17:01:47
thanks 'R'....
I've decided to go in another direction.... with expandable and collapsable divs... i like it... i think for the application it'll look just as good.
but thanks anyway...
_____________________________
I have a ringing in my head and no one to help me answer it
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
