<div class="fbtop">
<img src="https://static.solidshops.com/1441/files/Logo-site.png" title="Pieke Wieke" alt="Pieke Wieke">
<h2 class="title">Handcrafted with love</h2>
<ul class="dropdown">
<li>
<a href="https://piekewieke-fb.solidshops.com/category/sewing-supplies">Sewing Supplies</a>
<ul class="sub_menu">
<li>
<a href="https://piekewieke-fb.solidshops.com/category/sewing-supplies-assorted-items">Assorted Items</a>
</li>
<li>
<a href="https://piekewieke-fb.solidshops.com/category/sewing-supplies-pins">Pins</a>
</li>
<li>
<a href="https://piekewieke-fb.solidshops.com/category/sewing-supplies-needles">Needles</a>
</li>
</ul>
</li>
<li>
<a href="/category/fabrics">Fabrics</a>
<ul class="sub_menu">
<li>
<a href="/category/fabrics-solid-colors">Solid Colors</a>
</li>
<li>
<a href="/category/fabrics-cotton">Cotton</a>
<ul>
<li>
<a href="/category/fabrics-cotton-pieke-wieke-for-soft-cactus">Pieke Wieke for Soft Cactus</a>
</li>
<li>
<a href="/category/fabrics-cotton-soft-cactus">Soft Cactus</a>
</li>
<li>
<a href="/category/fabrics-cotton-printed-cotton">Printed Cotton</a>
</li>
<li>
<a href="/category/fabrics-cotton-basics">Basics</a>
</li>
<li>
<a href="/category/fabrics-cotton-stretch-cotton">Stretch Cotton</a>
</li>
</ul>
</li>
<li>
<a href="/category/fabrics-printed">Printed</a>
</li>
<li>
<a href="/category/fabrics-stretch-cotton">Stretch Cotton</a>
</li>
<li>
<a href="/category/fabrics-knit">Knit</a>
</li>
<li>
<a href="/category/fabrics-flannel">Flannel</a>
</li>
<li>
<a href="/category/fabrics-gabardine">Gabardine</a>
</li>
<li>
<a href="/category/fabrics-corduroy">Corduroy</a>
</li>
<li>
<a href="/category/fabrics-lining">Lining</a>
</li>
<li>
<a href="/category/fabrics-teddy-fleece">Teddy Fleece</a>
</li>
<li>
<a href="/category/fabrics-woven">Woven</a>
</li>
</ul>
</li>
<li>
<a href="/category/iron-on-vinyl">Iron-On Vinyl</a>
</li>
<li>
<a href="/category/workshops">Workshops</a>
</li>
<li>
<a href="/category/gift-certificates">Gift Certificates</a>
</li>
<li>
<a href="/category/vlieseline">Interfacing</a>
</li>
<li>
<a href="/category/haberdashery">Haberdashery</a>
<ul class="sub_menu">
<li>
<a href="/category/haberdashery-ribbon">Ribbon</a>
</li>
<li>
<a href="/category/haberdashery-thread">Thread</a>
</li>
<li>
<a href="/category/haberdashery-zippers">Zippers</a>
</li>
<li>
<a href="/category/haberdashery-piping">Piping</a>
</li>
<li>
<a href="/category/haberdashery-bias-tape">Bias Tape</a>
</li>
<li>
<a href="/category/haberdashery-elastic">Elastic</a>
</li>
</ul>
</li>
</ul>
</div>
Here is a traditional dropdown menu created using CSS. To view its functionality, you can visit http://jsfiddle.net/W6Rhe/.
However, there seems to be an issue with the menu. When selecting the first item "Sewing Supplies," the first sub-menu item should appear in red but shows up as white instead.
A similar problem occurs when clicking on "Fabrics" and then selecting the "Cotton" sub-menu.
Interestingly, changing all the links to relative URLs resolves the issue and displays all items in red color as intended.
I'm puzzled by what could be causing this strange behavior. Any insights would be greatly appreciated!
P.S. This has been tested on Chrome. P.P.S. Changing the URLs to anything other than their current format seems to eliminate the problem. Quite bizarre indeed...