Some improvements

[Nyalab]

I think you should modify some rules in your css files.

• audio, canvas, progres, videoshould be `display: inline-block;
• please do not reset the font size on the html :-(
• embrace the normalize more than the reset (margin, padding, ...)
• use something else than display: table/table-cell; for your grid, too much constraints
• https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L519 i think it should be 'centered' more than 'center'
• https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L526 really ?
• https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L662 it is not very dynamic, you should remove that
• you have the ability to hide on tablets, mobile, ... but not to say "only visible on these devices"

I am stopping there and want to see your feedback before going further :-)

Peace !

[nico3333fr]

Hi,

audio, canvas, progres, videoshould be `display: inline-block;

I will fix this asap.

please do not reset the font size on the html :-(

Why ? It is useful to make Röcssti rem-practical. However, if you don't need, you may customize.

embrace the normalize more than the reset (margin, padding, ...)

Could you be more precise ?

use something else than display: table/table-cell; for your grid, too much constraints

display: table is very useful, you might read this : http://colintoh.com/blog/display-table-anti-hero

https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L519 i think it should be 'centered' more than 'center'

It is named like this to make echo to left and right classes.

https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L526 really ?

Yes : http://www.alsacreations.com/astuce/lire/1565-acceleration-materielle-au-service-de-vos-animations-css.html (to be used with extend with Sass, per example)

https://github.com/nico3333fr/ROCSSTI/blob/master/css/rocssti-en.css#L662 it is not very dynamic, you should remove that

Why not, I will have a look asap.

you have the ability to hide on tablets, mobile, ... but not to say "only visible on these devices"

Yes, you just have to say : class="nodesktop nomobile" for the tablets :). I already wondered with my collegue if we really do need this, and we never had the real need of. However, I will check to add this possibility.

[Nyalab]

Hey,

Do not change the font-size to 10px. First, it is semantically wrong, you do not want to have a default font-size to 10px, it is way too small for anything. Secondly, it is just for helping you calculating em i think, so your problem is here, do not solve it by degrading the readability or the consistency of your stylesheet, learn to leave the default font-size alone, and deal with (http://www.filamentgroup.com/lab/how-we-learned-to-leave-body-font-size-alone.html).

Then, do not reset properties to 0. Use the normalize.css, to set the little details as they should look like, you do not have the power to say "everything has 0 margin now", it is not a good solution, deal with default styles, or at least, use normalize.css.

The problem with table-cell for grids is that you can not have the line break if you have more element than your row should have (grid-row-12, imagine you have 6 elements that have grid-cell-6, they should make several lines, with table-cell, you cannot). Then you have the offset problem, you have to make empty dom elements. And you will have some problems if you want to use some tricky position properties (in my memory, table-cell and absolute, fixed, ... still have some problem on firefox).

So, you have to change .left and .right too :-) Even if i do not like bootstrap, even they have .pull-*, to say it is the passive form (centerd, pulled to left), and not the active form (center, left, ...).

Okay for hardware accelerated, it is just a little big too much for me, i won't use it like that, but i get the use case, thanks for the link.

Your css project is too tied to your needs i think, imagine if i want 4 versions (like i am working right now with my profesionnal project), you should have more ways to do that :-)

Anyway, thanks for replying, have fun !

[nico3333fr]

I don't see why "semantics" comes into a CSS issue. The font-size is re-set up on body tag, it is not a problem, it respects users values. You can test on Röcssti website : http://rocssti.net/ (set up different font-size value by default, it will work perfectly)

I've read the post of Filament, a comment in it also indicated why the reset on html and the set up on body is a good choice (and rem compatible) : http://snook.ca/archives/html_and_css/font-size-with-rem

For table-layout, I don't see where it is written in Röcssti that it is used for grids. The .grid element uses inline-blocks.

However, thanks for your remarks, I've run several updates to take some of them into account.

Cheers, Nicolas