Some links are not clickable in Internet Explorer 6, why? - html

I'm having problem with IE 6 (what a surprise : D)
On this site, in the content, I cannot click on the first few links. But after a few items, the links are working fine.
This problem appears if I load a page with ajax from the menu.
I couldn't figure out the problem, has anybody seen something like this before?
The HTML code is:
<div id="cont" style="display: block;">
<div class="localHeader">
<span> Szállás > Magánszállás </span>
</div>
<div class="subList">
<div class="productContainer">
<div class="img">
<img style="width: 200px;" src="/up/21/480_98_szarka2_255.jpg">
</div>
<div class="text">
<div class="productName">
<a title="Szarka család" href="/cats/showItem/21" rel="history"> Szarka család </a>
</div>
<div class="productDatas">
kato55#freemail.hu
<br>
<a title="Szarka család" href=""></a>
<br>
+36 84 314 062
</div>
<div class="productText"></div>
<a title="Szarka család" href="/cats/showItem/21" rel="history" class="moreButton"> Részletek </a>
</div>
</div>
</div>
</div>
Of course the .productContainer is repeating in the .subList.
Thanks.

Make sure that you have explicitly set overflow:auto on .productContainer. If that doesn't work, try Googling "clearfix" and see if that doesn't fix your problem.

You should ensure that your HTML validates against the DocType you're using, at the moment it doesn't and this can effect how browsers render parts of the page.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fbalatonnet.com%2Fcats%2FlstSubCat%2F13

Related

Link to same page using div class

I am posting the code. In the line <div class='qrcode-value'></div> it will scan the qr code and I want to make it as link so that it will redirect to the other website once clicking on it. Instead of copy and paste.
<div id="content-overlay" style='display: none'>
<div class='qrcode-value'>
</div>
</div>
<a href="http://google.com">
<div class='qrcode-value'>
anything
</div>
</a>
fiddle https://jsfiddle.net/athulmathew/r73pn4w8/2/
You can use JavaScript to do this.
<div id="content-overlay" style='display: none'>
<div class='qrcode-value' onclick="location.href = 'https://stackoverflow.com/questions/56946816/link-to-same-page-using-div-class';">
</div>
</div>
Read more about onclick event here.

Anchor Link HTML

I'm trying to set up an anchor link for my site to jump to a particular heading on the same page. Below is my current code, but when you select the link nothing happens. Any help would be great, thanks!
Section I want the link to jump to
<div class="heading1">
<h2 style="margin-bottom:-5px;font-size:40px;"><a id="#work"></a>content</h2>
<p style="font-size: 26px;">content</p>
</div>
Link
<div class="contact mobile">
<a href=“#work”>Work</a>
</div>
need to refer the href to the id of the div you want to jump to href="#jump"
<div class="heading1" id="jump">
<h2 style="margin-bottom:-5px;font-size:40px;">content</h2>
<p style="font-size: 26px;">content</p>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div class="contact mobile">
Work
</div>
brother remove hash from attribute id="#work" use just id="work">

Mailto links affecting code with no <a href tag

I have wracked my brain and can not find the reason this is happening. I have some links in one div that are mailto which work fine. But P tags and an image in a div in the next column seem to be inheriting the mailto.
I am using bootstrap. Has anyone come across this before? Can anyone see something I am missing?
Top of container with affected code:
<div class="row rowSettings col-sm-12">
<div class="col-sm-3 text-left sidepanel">
Some divs, then this div with the mailto links:
<li class="leftSubNavLinks"><a class="sublinks" href="mailto:email#domain.com?subject=message subject&body=prepopulated message" target="_blank"Contact</li>
and the following div that is inheriting the mailto:
<div class="col-sm-9 text-left">
<div class="col-sm-8 titleContainer">
<img src="url/image.svg" alt="">
</div>
<div class="col-sm-4 titleContainer">
<h1 class="mainTitle"> Title text</h1>
</div>
</div>
<div class="col-sm-9 clearfix">
<p class="bodyCopy" id="body-text">some text here</p>
</div>
You haven't closed your <a>
<li class="leftSubNavLinks">
<a class="sublinks" href="mailto:email#domain.com?subject=message subject&body=prepopulated message" target="_blank">Contact</a>
</li>
You aren't closing your <a> tag
<li class="leftSubNavLinks">
<a class="sublinks" href="mailto:email#domain.com?subject=message subject&body=prepopulated message" target="_blank"Contact
</li>
Should be:
<li class="leftSubNavLinks">
<a class="sublinks" href="mailto:email#domain.com?subject=message subject&body=prepopulated message" target="_blank">Contact</a>
</li>
The browser will try to "fix" your broken code by closing the tag where it thinks it should be closed. This is almost certainly not where it should be closed which is why your following HTML is being bundled up into the <a>.

IE8 Wordpress Website Compatibility Issue - Sidebar Showing on Bottom Of The Page

I have this website http://www.basketballworkouttips.com/jump-manual-review/ and the problem is when viewing it in IE8 the sidebar gets pushed down to the bottom of the page. however, if I remove the review box from the page the side bar is showing ok.
I want to keep the review box but I don't want my side bar to be pushed down.
any idea how to fix this?
Here's the review box code
<div class="review">
<div itemtype="http://schema.org/Product" itemscope="">
<div itemtype="http://schema.org/Review" itemscope="">
<div class="ta_rating_container ta_box_right" style="width:240px;">
<div id="ta_rating">
<div>
<div>Review of:
<span class="title item fn" itemprop="name">
<a onclick="_gaq.push(['_trackEvent', 'Affiliate Clicks', 'Jump Manual', '/jump-manual-review/-Review Box Link',, false]);" rel="nofollow" href="http://www.basketballworkouttips.com/go/jumpmanual" title="Jump Manual">Jump Manual</a>
</span>
</div>
<div class="clear"></div>
<dl>
<div class="clear_space"></div>
<div class="hr"><hr /></div>
<div>Reviewed by:
<span class="reviewer author byline vcard hcard">
<span class="author me fn" itemprop="author">Jesse Parker</span>
</span>
</div>
<dl>
<dt>Rating:</dt>
<dd>
<div class="ta_rating result rating" itemtype="http://schema.org/Rating" itemscope="" itemprop="reviewRating">
<meta content="1" itemprop="worstRating">
<meta content="5" itemprop="ratingValue">
<meta content="5" itemprop="bestRating">
<div class="result" style="width:100%;" title="5">5</div>
</div>
</dd>
</dl>
<div class="clear"></div>
<div class="clear_space"></div>
<div class="hr"><hr /></div>
<h3>Summary:</h3>
<div class="ta_description summary" itemprop="description">
<p>
<span>The Jump Manual is an effective program that will help you increase your vertical leap. The program is easy to follow and provides one on one coaching from it's author + exclusive 60 day money back guarantee. if you're looking to increase your vertical this program is the best one to go for.
</span>
</p>
</div>
</div>
<div class="rating_btn">
<a onclick="_gaq.push(['_trackEvent', 'Affiliate Clicks', 'Jump Manual', '/jump-manual-review/-Review Box Button',, false]);" itemprop="url" class="ar_button ar_orange" href="http://www.basketballworkouttips.com/go/jumpmanual" title="Download Jump Manual" rel="nofollow">Download Jump Manual</a>
</div>
<div class="clear"></div>
</div>
</div>
<div itemprop="reviewBody">
<div itemtype="http://schema.org/Thing" itemscope="" itemprop="itemReviewed">
<meta content="Jump Manual" itemprop="name">
</div>
This looks like a nesting issue. Your sidebar is within the same block element as your #content. Thusly floats will not work properly. FireFox and other browsers are most likely auto-correcting it, but IE8 is limited and does not give guess work to assist.
I would correct the issue by placing the #sidebar_wrap_right and placing it at the same level as #content. Then be sure to add a width to both in CSS and float the 2 divs left adding margin/padding as needed.
I also have never seen the tag below that is rendering, it is possible you have some invalid HTML and CSS as well.
<css3-container style="z-index: auto; position: absolute; direction: ltr; top: 5500px; left: 28px;">

Link (Href) to a hidden (display:none) html element

I've a problem with anchor tags :/
I've got the following code:
<div name="divA">
<a name="A"> A</a>
</div>
<div name="divB" style="display: none;">
<a name="B"> B</a>
</div>
<div name="divHrefB">
B
</div>
My goal is that when i click on B (divHrefB) the application go to "divB" but since this element hidden it doesn't work.
Please note, that i don't want to show divB (i want a link to the place where div are... is that possible?
At this point, i'm thinking on generate dynamically the href value (in this case, i would generate the following div)
<div name="divHrefB">
B
</div>
Thanks a lot.
just don't apply display: none, just add this css for the hidden div.
<div name="divHrefB" style="height: 0px;width: 0px;overflow:hidden;">
B
</div>
You're missing the ending closing " comment.
try this guy:
style="display: none;"
you are missing " in style end
<div name="divA">
<a name="A"> A</a>
</div>
<div name="divB" style="display: none;">
<a name="B"> B</a>
</div>
<div name="divHrefB">
B
</div>