overflow-y AMP HTML error

For technical support and bug reports for all editions of CSS HTML Validator, including htmlval for Linux and Mac.
Post Reply
Lotekh
Rank 0 - Newcomer
Posts: 5
Joined: Sat Oct 12, 2019 6:33 am

overflow-y AMP HTML error

Post by Lotekh »

Hello,

I found a new error, that in amp developer site is not reported, but it's used:
The "overflow-y" CSS property may not be styled as "auto" or "scroll". User defined elements in AMP documents may not have a scrollbar.

Thanks,
Adrian Petre
User avatar
Albert Wiersch
Site Admin
Posts: 3785
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: overflow-y AMP HTML error

Post by Albert Wiersch »

Lotekh wrote: Sat Nov 02, 2019 5:45 am I found a new error, that in amp developer site is not reported, but it's used:
The "overflow-y" CSS property may not be styled as "auto" or "scroll". User defined elements in AMP documents may not have a scrollbar.
Hello,

Please see:
https://amp.dev/documentation/guides-an ... properties
AMP documentation wrote:overflow (and overflow-y, overflow-x) may not be styled as “auto” or “scroll”. No user defined element in an AMP document may have a scrollbar.
Is this a user defined element? Can you tell me where the overflow-y CSS property is being used (supply a small piece of example HTML/CSS and where it came from).

Thank you.
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
Lotekh
Rank 0 - Newcomer
Posts: 5
Joined: Sat Oct 12, 2019 6:33 am

Re: overflow-y AMP HTML error

Post by Lotekh »

Hello,
It's in vopsele.xyz as follow:
<div id="mobile_navigation_wrapper" class="mobile_navigation_wrapper show" [class]="menu_visibility ? 'mobile_navigation_wrapper show' : 'mobile_navigation_wrapper hide'" role="button"><ul class="navigation_ul_mobile" i-amphtml-fixedid="F3"><li><div class="center" id="header_login_actions_wrapper_mobile"><span>Bine ai venit, utilizatorule</span><br><button id="auth_lightbox_trigger_mobile" class="ampstart-btn caps m2" on="tap:auth-lightbox" role="button" tabindex="0"> Autentifica-te </button></div></li><li><a href="">Acasa</a></li><li class="dropdown"><a class="dropdown_toggle" href="#"> Cine suntem <span class="caret"></span></a><ul class="dropdown-menu"><li><a href="/despre-noi">Despre noi</a></li><li><a href="/politica-de-calitate">Politica de Calitate</a></li><li><a href="/politica-de-mediu">Politica de Mediu</a></li><li><a href="/politica-de-securitate">Politica de Securitate</a></li><li><a href="/certificari-iso">Certificari ISO</a></li><li><a href="https://emex.ro/catalog-emex.pdf">Catalog “Emex”</a></li></ul></li><li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#"> Produse <span class="caret"></span></a><ul class="dropdown-menu"><li id="all_products_menu_item_mobile"><a href="/produse">Toate Produsele</a></li><li><a href="/vopsele-lavabile">Vopsele Lavabile</a></li><li><a href="/vopsele-decorative">Vopsele Decorative</a></li><li><a href="/tencuieli-decorative">Tencuieli Decorative</a></li><li><a href="/vopsele-industriale">Vopsele Industriale</a></li><li><a href="/produse-hidrosolubile">Produse Hidrosolubile</a></li><li><a href="/produse-turnate">Produse Turnate</a></li><li><a href="/vopsele-pardoseli-trafic">Vopsele Pardoseli &amp; Trafic</a></li><li><a href="/grunduri-amorse-apa">Grunduri &amp; Amorse: Apa</a></li><li><a href="/grunduri-anticorozive">Grunduri Anticorozive</a></li></ul></li><li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#"> Servicii <span class="caret"></span></a><ul class="dropdown-menu"><li><a href="/aplicare-covor-epoxidic-stb">Pardoseli Cuartz Epoxi</a></li><li><a href="/aplicare-pardoseala-epoxidica-autonivelanta">Autonivelanta Epoxi</a></li><li><a href="/vopsire-epoxidica-pardoseli">Vopsiri Epoxidice</a></li><li><a href="/servicii">Servicii Generale</a></li></ul></li><li><a href="/contact">Contact</a></li></ul></div>

css:
.mobile_navigation_wrapper {
display: none;
width: 80%;
position: absolute;
height: 1000px;
overflow-y: auto;
background: #0f3661;
z-index: 999;
}

Thank you for your kindness,
Adrian Petre
User avatar
Albert Wiersch
Site Admin
Posts: 3785
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: overflow-y AMP HTML error

Post by Albert Wiersch »

Hi Adrian,

Is the CSS with "overflow-y: auto" user defined CSS (thus not part of an AMP HTML component)? Or is it part of an AMP HTML component?

If it's user defined (it looks like it is user defined to me but I am not certain) then I believe the validator message is correct per the link I posted in my previous reply.

In any case, if you are sure you want to ignore the validator message about overflow-y then you can right-click on the message (in the Results Window) and disable the message or you can change its type (like from error to warning).
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
Post Reply