Re: HTML5 / CSS3 overlay property

On 20 July 2015 at 08:02, Brandon Gibbs <gibbs.brandon.d@gmail.com> wrote:
>
> Hi,
>
>    I sent a suggestion for a CSS property that could make for a better
> workflow given the enormous popularity of websites that are already using a
> workaround to achieve a particular effect. The overlay.
>
>    Below you'll see that I was pointed in your direction, as well as a
> detailed explanation of how I feel it would best work.
>
>    Thank you so much for taking the time and I hope to hear that it will be
> considered as an addition..
>
> - Brandon D Gibbs
>
> ---------- Forwarded message ----------
> From: Ian Jacobs <ij@w3.org>
> Date: Sat, Jul 18, 2015 at 9:58 PM
> Subject: Re: HTML5 / CSS3 overlay property
> To: Brandon Gibbs <gibbs.brandon.d@gmail.com>
>
>
> Hi Brandon,
>
> Thank you for taking the time to write up your suggestion. Unfortunately,
> I’m not the best person to receive it. Have you considered
> sharing it with the CSS WG (e.g., on www-style@w3.org?
>
> Ian
>
>
>> On Jul 17, 2015, at 6:27 PM, Brandon Gibbs <gibbs.brandon.d@gmail.com>
>> wrote:
>>
>> Hello,
>>
>>    I know you and the rest of the staff probably get 100 emails a day
>> regarding things like this, but I just couldn't sit quiet on this. I know
>> that everyone thinks that they have the next great idea to improve the
>> entire internet. I'm not claiming that, but I do have something at would
>> incredibly improve workflow in one area.
>>
>>     Look at the popularity of Twitter's Bootstrap. That only added to the
>> need for this workflow idea. Well, not just workflow....
>>
>>     There is an abundance of websites that utilize sliders, "jumbotrons",
>> and image galleries, and blog lists that utilize a photo with text overlay.
>> This presents a few options for improved flow and, I believe, slightly
>> improved site performance.
>>
>>     An "overlay" element added to the HTML side... and/or an overlay:
>> property added to the CSS side.
>>
>>     My imagination of this functioning would be to quickly and easily add
>> an overlay. On the CSS side, this could be used in the same div that adds a
>> background image...
>>
>>     .jumbotron {
>>        background: url('../img/cover-photo.png')
>>        background-size: cover;
>>        overlay:
>>        overlay-size: override the auto covering of the div
>>        overlay-position: just like the background-position property
>>      }
>>
>>    Now the overlay: could be used a shortcut. Hexidecimal color, opacity,
>> rgba, image via url() much like the background-image property..
>>
>>    Overlay-size:  Again, my imagining of this would have the property
>> automatically cover the div to which it is being added. This part of the
>> property would of course override that, allowing for flexibility. If the
>> user did not want to cover an entire div, img, etc...
>>
>>     Overlay-position:  As stated above, this is just like the
>> background-position property.
>>
>>     Now, if there was an HTML element added to this, I'm thinking it would
>> behave much like any other <div> in a way. So, if placing text between
>> <overlay> and </overlay> would have it show over the image and any overlay
>> properties added like an overlay image, color, etc...
>>
>>     The HTML element might seem a bit overkill, and even not much of an
>> improvement over just using the <div> element as we do now... and in most
>> cases it might be. Consider that <overlay> would be of some importance,
>> making them a bit like heading tags.
>>
>>       Of course, there is probably room for improvement, tweaking and
>> shifting to make it fit with what the vision is for CSS3 and beyond.
>> However, it would fill a need. You can easily search and find several
>> websites, including stackoverflow, that are using workarounds. I feel that
>> workarounds such as this add unnecessary time to the development process,
>> and a, negative effect on site performance if the workaround is used often,
>> which is the case for a good deal of photography sites, blogs, and much
>> more.
>>
>> Thank you for your time, and entertaining this thought.
>>

This sounds similar to the suggestion at
https://lists.w3.org/Archives/Public/www-style/2014Dec/0092.html.

Sebastian

Received on Thursday, 23 July 2015 13:02:57 UTC