overflow-y AMP HTML error

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

overflow-y AMP HTML error

Post by Lotekh » Sat Nov 02, 2019 5:45 am

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
Site Admin
Posts: 3438
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: overflow-y AMP HTML error

Post by Albert Wiersch » Mon Nov 04, 2019 11:47 am

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.
Image
Albert Wiersch

Lotekh
Rank 0 - Newcomer
Rank 0 - Newcomer
Posts: 5
Joined: Sat Oct 12, 2019 6:33 am

Re: overflow-y AMP HTML error

Post by Lotekh » Thu Nov 07, 2019 9:08 am

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
Site Admin
Posts: 3438
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: overflow-y AMP HTML error

Post by Albert Wiersch » Thu Nov 07, 2019 9:30 pm

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).
Image
Albert Wiersch

Post Reply