Breadcrumbs doesn't show in Internet Explorer

13 Posts

JonHnefill Reply #1, 18 years, 1 month ago

Hello there.

I am using the latest version of MODxCMS and the Breadcrumbs snippet that comes with it. The Breadcrumbs show in Firefox without a problem but for some reason it doesn’t show in Internet Explorer 7.

Here is how it looks in Firefox:

and here is how it shows in IE 7:

This is how I call for the Breadcrumbs snippet in the HTML template:

<div id="breadcrumbs">
[[Breadcrumbs]]
</div>

Does anyone have any idea why this might be happening ?

Thanks,

/Johnny

☆ A M B ☆
24,524 Posts

sottwell Reply #2, 18 years, 1 month ago

Most likely an IE bug in the CSS. Did you check your page’s source in the browser to see if they are actually in the source, just not being displayed?

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

13 Posts

JonHnefill Reply #3, 18 years, 1 month ago

Thanks Sottwell

The breadcrumbs snippet is visible in the source code when I open the page in IE as can been seen here:

    <div id="logo">
		<img src="images/LOGO.png" border="0" alt="" />
    </div>
    
<div class="navBarTop">
    	<a href="http://www.jamdigital.dk/alexandra/en/">Home</a>
    	<a href="http://www.jamdigital.dk/alexandra/en/info">Info</a> 
    	<a href="http://www.jamdigital.dk/alexandra/en/booking">Booking</a>
    	<a href="http://www.jamdigital.dk/alexandra/en/rooms" id="current">Rooms & Rates</a> 
    	<a href="http://www.jamdigital.dk/alexandra/en/philosophy">Philosophy</a> 
    	<a href="http://www.jamdigital.dk/alexandra/en/press">Press</a>
    	<a href="http://www.jamdigital.dk/alexandra/en/blog">Blog</a>
    	<a href="http://www.jamdigital.dk/alexandra/en/links">Links</a>
    	<a href="http://www.jamdigital.dk/alexandra/en/contact">Contact</a>
    </div>                                                                      
    <div id="lang">
    <a href="http://www.jamdigital.dk/alexandra/dk/">Danish</a> | <a href="http://www.jamdigital.dk/alexandra/en/" id="active">English</a>
    </div>  
    <div class="navBarBottom">
        <a href="http://www.jamdigital.dk/alexandra/en/rooms/offers">Offer of the Day</a>
        <a href="http://www.jamdigital.dk/alexandra/en/rooms/special_offers">Special Offers</a>
        <a href="http://www.jamdigital.dk/alexandra/en/rooms/company_offers">Company Offers</a>
         <a href="http://www.jamdigital.dk/alexandra/en/rooms/guarantee">Guarantee & Payment</a>
    </div>

[b]    <div id="breadcrumbs">
<span class="B_crumbBox"><span class="B_firstCrumb"><a class="B_homeCrumb" href="/alexandra/en/home.html" title="The Hotel Alexandra website website">Home</a></span> » <a class="B_crumb" href="/alexandra/en/rooms.html" title="Rooms and rates, Prices & Special Offers">Rooms & Rates</a> » <span class="B_lastCrumb"><span class="B_currentCrumb">Guarantee & Payment</span></span></span>
</div>[/b]

<div id="press">
<iframe width="812" height="25" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.jamdigital.dk/alexandra/scripts/randomquotes.php"></iframe>
</div>

    <div class="contentMain">
    <quickedit:content /><div style="overflow: auto; width: 367px; height: 441px">
<span class="OVERSKRIFT4">Garanti og betaling </span>
<br />
<br />
<strong>SEN ANKOMST & GARANTI </strong>
<br />
Såfremt der er ankomst efter kl. 18:00 er det nødvendigt at
garantere reservationen. Venligst oplys Deres kreditkort type,
indehaver, nummer og udløbsdato. Annullering efter kl. 18:00 på
ankomstdagen eller manglende fremmøde vil medføre opkrævning af 1. nats
ophold.
<br />

So after I started modifying the CSS and HTML a little bit I found an element that was overlapping the breadcrumbs trail. So after fixing absolute positioning to relative and changing widths it became visible again. Thanks for the suggestion

/Johnny