rubric width - a better solution?

rubric width - a better solution?

by Garth Brady -
Number of replies: 1

Greetings all,

I wanted to make more use of the screen to display a rubric when editing so I added the following css which although seems excessive to me, was the best I could come up with.

.path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"] { max-width: 100%; margin: 0 5rem; }
#rubric-advancedgrading, .criteria .levels, .criteria tbody { width: 100%; } // this line and the one above make rubrics appear full-width

Is anyone aware of a more efficient way of accomplishing the same thing with fewer classes?


Average of ratings: Useful (2)
In reply to Garth Brady

Re: rubric width - a better solution?

by Mehwish Hayaat -
Yes, there is a more efficient way to accomplish the same thing with fewer classes. You can simplify your CSS code by using the following: cs
.path-mod-assign [data-region="grade-panel"].fullwidth [data-region="grade"], #rubric-advancedgrading, .criteria .levels, .criteria tbody { width: 100%; max-width: 100%; margin: 0 5rem; }

By combining the CSS selectors into one rule, you can achieve the same result while reducing the amount of code needed. This makes it easier to maintain and reduces the amount of CSS being processed by the browser.