[SOLVED] Repetitive sublayout - How can I make it unique

Repetitive sublayout - How can I make it unique - to meet ADA requirements

I have a search box that is loaded twice - once for desktop and once for mobile.

Device determines which is displayed. However, due to ADA, the labeling needs to be unique.

Is there a way to call the sublayout and generate unique tag for each of the html elements to use?

Or, is there a way to generate a tag within the sublayout to ensure the tags are unique.

<div id="desktop">
<sc:Sublayout Path="~/site/sublayouts/Shared/QuickSearch.ascx" runat="server" />
</div>
<div id="mobile-search" class="hidden">
<sc:Sublayout Path="~/site/sublayouts/Shared/QuickSearch.ascx" runat="server" />
</div>

----------- within the layout

<div class="searchtool">
<img src="/includes/images/search.png" alt="Search" style="float:left"/>
<div style="float:left">
<fieldset class="search"  aria-labelledby="Name">

The alt and aria-labelledby tags need to be unique.

Thanks

Solution

I ended up duplicating the sub-layout section - with a new name and changing all the tag elements to reflect different names.