CSS Widget Grids - Border Color?

Use this board to ask questions or have discussions with other Rich Displays users.
Post Reply
mrojek
New User
Posts: 12
Joined: Fri Nov 30, 2012 3:48 pm
First Name: Mike
Last Name: Rojek
Company Name: McGard
State / Province: New York
Zip / Postal Code: 14127
Country: United States
Contact:

CSS Widget Grids - Border Color?

Post by mrojek »

Profound,

Having issues setting the border color in my custom grid widget. Which built-in class for the grid widget do I use? I saw that in version 4.6 that this had been allowed.

Thanks,
Mike R
Scott Klement
Experienced User
Posts: 2711
Joined: Wed Aug 01, 2012 8:58 am
First Name: Scott
Last Name: Klement
Company Name: Profound Logic
City: Milwaukee
State / Province: Wisconsin

Re: CSS Widget Grids - Border Color?

Post by Scott Klement »

I'm not sure what you are asking. Are you referring to setting the "css class" for a grid? That is not a new feature, it has always been there. You mention 4.6 which is about 4 years old and no longer supported... But, I think what you're seeing there is that we added CSS buttons, CSS panels, etc. None of these are grids...

Can you explain better? The clearer idea we have of what you want to do, the more likely we'll be able to help you.
mrojek
New User
Posts: 12
Joined: Fri Nov 30, 2012 3:48 pm
First Name: Mike
Last Name: Rojek
Company Name: McGard
State / Province: New York
Zip / Postal Code: 14127
Country: United States
Contact:

Re: CSS Widget Grids - Border Color?

Post by mrojek »

Scott,

Thanks for responding! I am referring to changing the attributes on a Custom Widget (http://www.profoundlogic.com/docs/displ ... rid+widget). Is there a way to change the border color attribute of the grid using CSS? See the screen shot of the grid attribute.

Thanks,
Mike
Attachments
pic.png
pic.png (9.91 KiB) Viewed 1215 times
Scott Klement
Experienced User
Posts: 2711
Joined: Wed Aug 01, 2012 8:58 am
First Name: Scott
Last Name: Klement
Company Name: Profound Logic
City: Milwaukee
State / Province: Wisconsin

Re: CSS Widget Grids - Border Color?

Post by Scott Klement »

Yes, you would remove the "border color" property, and use a CSS class instead.

The vertical lines in the grid are given the "grid-vline" and "CLASSNAME-vline" css classes. The horizontal grid lines are given "grid-hline" and "CLASSNAME-hline" classes, where CLASSNAME represents the CSS class applied to the grid. For example, if the CSS class property is set to "simple-grid" then it would use "simple-grid-vline" and "simple-grid-hline".

That way, you can set a style that applies to all grids, and you can also set a style that applies to grids with a specific CSS class. Like all CSS classes, they cascade, so the settings in the CLASSNAME-hline/vline override anything set in the grid-hline/vline. the "border color" takes precedence over both.

So if you wanted something with the "simple-grid" CSS class to have red borders you would do:

Code: Select all

.simple-grid-hline {
   border-color: #FF0000;
}
.simple-grid-vline {
   border-color: #FF0000;
}
I would suggest that you learn how your browser's CSS inspector tools work. They will help you out greatly with understanding and debugging stuff like this.
mrojek
New User
Posts: 12
Joined: Fri Nov 30, 2012 3:48 pm
First Name: Mike
Last Name: Rojek
Company Name: McGard
State / Province: New York
Zip / Postal Code: 14127
Country: United States
Contact:

Re: CSS Widget Grids - Border Color?

Post by mrojek »

Thanks Scott, works great! I use the Chrome Inspect tool all the time, I must have missed the vline and hline.

Mike
BookerMar
New User
Posts: 1
Joined: Thu Aug 17, 2017 9:48 am
First Name: Mark
Last Name: Booker
Company Name: Booker
Country: United States
Contact:

Re: CSS Widget Grids - Border Color?

Post by BookerMar »

meojek wrote:Thanks for suggesting this awesome pre workout Scott, works great! Chrome Inspect tool all the time, I must have missed the vline and hline.

Mike
Nice, thanks Scott. I got the color changed now.
Post Reply

Who is online

Users browsing this forum: No registered users and 1 guest