Page 1 of 1

How can I make rounded corners on grid?

Posted: Thu Nov 06, 2014 7:39 pm
by Miguel Carrillo

I need to make the border of this grid rounded to fit my app theme. I'm trying with this css class but It doesn't works, what I need is a rounded border or corners on that grid and show them in the same color that the grid background.

.roundbox {
border-collapse: separate !important;
border: 10px #f4f4f4 solid !important;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

This is how appears in the app:
http://gyazo.com/fdc4aca6cdeab43b0d1c...

This is how is build:
http://gyazo.com/86d99ff1fc80b1efa77a...


How can I make rounded corners on grid?

Posted: Thu Nov 06, 2014 11:06 pm
by Yurii Orishchuk

Hi Miguel,

Please use following CSS code:

pre

.roundbox {
border: solid #ccc 1px;
border-radius: 25px;
background: #eee;
overflow: hidden;
}

/pre

Also don't forget to add "roundbox" class to your table.component.

Regards.