Topic: dynamic links in ie6, possible?

[frobak]

Hi

Ive got some php code thats dynamically generating a div with a link inside. For some reason the link is not clickable in ie6. Is this right or have i done something wrong?


PHP Code:
         <div class='briefdesc'>
          <div class='desc_title'>
           <p class='title_text'>$job_title</p>
           <p class='title_text'>$terms</p>
          </div>
          <div class='desc_details'>
           <table>
            <tr>
             <td class='detail_text'>Location:
             </td>
             <td class='detail_text'>$location
             </td>
            </tr>
            <tr>
             <td class='detail_text'>Salary:
             </td>
             <td class='detail_text'>$salary
             </td>
            </tr>
            <tr>
             <td class='detail_text'>Contract:
             </td>
             <td class='detail_text'>$terms
             </td>
            </tr>
           </table>
          </div>
          <div class='desc_more'>
           <a class='viewvacbut' href='view_vacancy_details.php?vacancy_id=$vacancy_id'><img class='no_marg' src='images/more_btn.png' /></a>
          </div>
         </div> 

so the link to view_vacancy_details.php is not clickable in ie6. Your thoughts. Should this work?

[slurpee]

Do you have a link to the page so we could check it out?  Using just the code you provided, that seems to work for me in IE6.

[frobak]

http://www.enetdesign.co.uk/onyx/view_vacancies.php


cheers 

[frobak]

Ive tried this without any variables. So this code is just dynamically displaying a link?

why am i finding this difficult? surely im missing something really simple?

[thorpe]

Can we see your code in a little more context? its pretty difficult to see whats going on with that small snippet.

[frobak]

Heres the code thats displaying a div and link depending on how many rows in the db. this works in ie7/ie8 all firefox versions, safari, everythign except the dreaded ie6.

thanks in advance1

<div id="search_main_text">

<?php

include("includes/db_connect.inc.php");

$query= $filter;

$result=mysql_query($query);

$num=mysql_numrows($result);

mysql_close();

$i=0;

while ($i < $num) {

$vacancy_id = mysql_result($result,$i,'vacancy_id');

$job_title = mysql_result($result,$i,'job_title');

$salary = mysql_result($result,$i,'salary');

$location = mysql_result($result,$i,'location');

$terms = mysql_result($result,$i,'terms');

echo "

<div class='briefdesc'>

<div class='desc_title'>

<p class='title_text'>$job_title</p>

<p class='title_text'>$terms</p>

</div>

<div class='desc_details'>

<table>

<tr>

<td class='detail_text'>Location:

</td>

<td class='detail_text'>$location

</td>

</tr>

<tr>

<td class='detail_text'>Salary:

</td>

<td class='detail_text'>$salary

</td>

</tr>

<tr>

<td class='detail_text'>Contract:

</td>

<td class='detail_text'>$terms

</td>

</tr>

</table>

</div>

<div class='desc_more'>

<a class='viewvacbut' href='view_vacancy_details.php?vacancy_id=$vacancy_id'><img class='no_marg' src='images/more_btn.png' /></a>

</div>

</div>

";

$i++;

}

?>

</div>

</div>

[thorpe]

What does the outputted html source look like in relation to this link?

[frobak]

heres the source from the output, looks ok to me!

Code: [Select]

<div class='briefdesc'>
<div class='desc_title'>
<p class='title_text'>Senior Project Accountant - Cyprus</p>
<p class='title_text'>Permanent</p>
</div>
<div class='desc_details'>
<table>
<tr>
<td class='detail_text'>Location:
</td>
<td class='detail_text'>Limassol, Cyprus
</td>
</tr>
<tr>
<td class='detail_text'>Salary:
</td>
<td class='detail_text'>£70,000 - £110,000
</td>
</tr>
<tr>
<td class='detail_text'>Contract:
</td>
<td class='detail_text'>Permanent
</td>
</tr>
</table>
</div>
<div class='desc_more'>
<a class='viewvacbut' href='view_vacancy_details.php?vacancy_id=MT 1001-13'><img class='no_marg' src='images/more_btn.png' /></a>
</div>
</div>

[Adam]

I'd guess this is a CSS issue if it's just IE6 having problems... What's the CSS look like for those divs?

[frobak]

/* ----------------------------  styles for job /vacancies page -------------------------------*/


#add_vacancy{
   margin: 20px 0 0 0;
   width: 805px;
   position: relative;
   float: left;
   }

#search_main_text{
   margin: 0px 0 25px 0;
   padding: 25px 0 15px 0;
   width: 798px;
   height: 370px;
   overflow: auto;
   position: relative;
   float: left;
   border: 2px solid #cccccc;
   }
   
.briefdesc {
   margin: 0px 0 10px 27px;
   padding: 0;
   width: 729px;
   height: 113px;
   position: relative;
   float: left;
   background: url(../images/vacancy_holder.png) no-repeat;
   }
   
   
.desc_title{
   margin: 20px 5px 0px 20px;
   padding: 0;
   width: 300px;
   height: 70px;
   position: relative;
   float: left;
   }
   
.desc_details{
   margin: 20px 5px 0px 0px;
   padding: 0;
   width: 270px;
   height: 70px;
   position: relative;
   float: left;
   }
   
.desc_more{
   margin: 20px 5px 0px 0px;
   padding: 0;
   width: 100px;
   height: 70px;
   position: relative;
   float: left;
   }
   
img.more {
   margin: 50px 0px 0px 0px;
   padding: 0;
   width: 96px;
   height: 27px;
   position: relative;
   float: left;
   border: 0;
   }
   
.title_text {
   margin: 0px 0 5px 0px;
   padding-top: 0;
   font-size: 12pt;
   font-weight: bold;
   color: #3366ff;
   text-decoration: none;
   font-family: tahoma, sans-serif;
   }
   
.detail_text {
   height: 20px;
   margin: 0px 0 10px 0px;
   padding-top: 0;
   font-size: 9pt;
   font-weight: bold;
   color: black;
   text-decoration: none;
   font-family: tahoma, sans-serif;
   }
   
   
#search_filter {
   margin: 0px 0 15px 40px;
   width: 740px;
   height: 45px;
   position: relative;
   float: left;
   }

#filter_form {
   margin: 13px 0 0px 40px;
   width: 250px;
   height: 30px;
   position: relative;
   float: left;
   }
   
img.filter {
   margin: 0px 0 0px 0px;
   position: relative;
   float: left;
   }
   
.vacancydetail_btn {
   position: absolute;
   top: 60px;
   left: 600px;
   border: 0;
   text-decoration: none;
   }

.viewvacbut {
   margin: 40px 0 0 0;
   width: 97px;
   height: 27px;
   position: relative;
   float: left;
   border: 0;
   text-decoration: none;
   }   

[Adam]

The problem's with your PNG transparency fix script.

[frobak]

mmmm, i think not. how did you come to that conclusion?

if i remove all styling, the text link is visible and underlined, but just not clickable?

[Adam]

I removed the $(document).pngFix() call, and it worked.

[frobak]

thanks Mr Adam. I didnt alter the png fix, i just made the buttons jpg instead, which worked fine. Thanks for pointing me in the right direction.

been stuck on this for about a week