we dont hav mani food in our villeg,so we ned a food supplie

https://developers.google.com/web/updates/2016/05/houdini

When using layout modes like flexbox and grid, there is a conflict between the desire to keep the DOM tree relatively flat, to avoid complex, unperformant, highly-nested layouts, and grouping elements in a way that makes sense semantically and allows easy manipulation via data-binding frameworks like Angular.

This conflict can be solved by supporting the "display: contents" box-generation mode from CSS Display Module Level 3. This allows elements to be configured to generate no box of their own, only those of their children. In this way, complex, nested DOM structures can generate much simpler box trees.

"caret-color" has just been implemented on Chromium and Firefox. It'd be really nice if Edge can support it too.

The spec is CR: https://www.w3.org/TR/css-ui-3/#caret-color

And there are already 21 tests on the W3C csswg-test repo: http://test.csswg.org/shepherd/search/testcase/spec/css-ui-3/section/6.2.1/

Implement the :placeholder-shown CSS pseudo-class

- http://caniuse.com/#feat=css-placeholder-shown
- https://drafts.csswg.org/selectors-4/#placeholder

This feature would add support for ::before and ::after pseudo elements in <input> elements. Chrome, Opera, and Safari already support using pseudo elements to embellish inputs without the need for JavaScript and extra divs.

The `i` flag is defined in the CSS Selectors module [1] and is supported by all the other major browser engines.

Demo: https://jsbin.com/sonubug/edit?html,css,output

[1]: https://drafts.csswg.org/selectors/#attribute-case

Provides a way to blend background images, colors, and gradients together.

The Writing Mode property has been implemented and updated in the current version of Edge, but it only includes the values of horizontal-tb, vertical-lr and vertical-rl. Two more values provide an easier way for authors to typeset text in a sideways orientation. They are currently implemented in Firefox (since Sept 2015).

https://www.w3.org/TR/css-writing-modes-3/#valdef-writing-mode-sideways-rl

Support CSS Animations and Transitions for SVG Properties on SVG Elements like:
stroke-dashoffset, stroke-dasharray, fill, stroke and so on.

Example Animation CSS that should work:

.svg {
animation:svg-animation 1.5s ease-in-out infinite;
}

@-webkit-keyframes svg-animation {
0% {
stroke-dasharray: 1, 50;
stroke-dashoffset: 0;
}
100% {
stroke-dasharray: 50, 150;
stroke-dashoffset: -100;
}
}

Currently this example is working in all browsers except in Edge.
I am not really sure if this is feature is SMIL, but since the animations are declared in CSS this shouldnt be really SMIL.

Would be nice to get some feedback.

Best regards,
Rene

Support vector-effect for SVG elements. vector-effect: non-scaling-stroke would allow strokes to keep the same width as the SVG scales as a whole. https://www.w3.org/TR/SVGTiny12/painting.html#VectorEffectProperty

Add support for scrollbar styling, similar to the earlier properties supported in Internet Explorer (i.e. scrollbar-base-color, etc)

https://drafts.csswg.org/selectors/#relational

The relational pseudo-class, ‘:has()#’, is a functional pseudo-class taking a relative selector list as an argument. It represents an element if any of the relative selectors, when absolutized and evaluated with the element as the :scope elements, would match at least one element.

Allows attr() to be used in any CSS rule (not just generated content), any CSS property (not just content) and for various data types.

Spec: http://www.w3.org/TR/css3-values/#attr-notation

This will revolutionize what we can do with CSS and enable a kind of decoupling between content and styling that has never been possible before.

Support the `element()` function https://drafts.csswg.org/css-images-4/#element-notation

Conic gradients [1] are useful for a number of effects on the Web that cannot be emulated in any other way (see [2]). They can be implemented in many graphics libraries today (e.g. Cairo) via mesh gradients. Please implement them.

[1]: http://www.w3.org/TR/css4-images/#conic-gradients
[2]: http://leaverou.github.io/conic-gradient

Add support for the paged media module, which will allow web sites and applications to have full control over print headers and footers among other things.

Spec: https://www.w3.org/TR/css3-page/

This declaration is used to preserve pixels when scaling up images (e.g. pixel art). IE provides this functionality via -ms-interpolation-mode: nearest-neighbor. The other browser engines also provide this functionality (see here: http://www.simevidas.com/2015/05/10/Blowing-up-pixel-art-on-the-Web.html).