By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,299 Members | 1,225 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,299 IT Pros & Developers. It's quick & easy.

a href round div not working in ie7 and ie6

100+
P: 347
i have the following div on a page the link works fine in ie8 and above but in 7 and 6 i do not get the hover finger and the link does not work

any ideas

Expand|Select|Wrap|Line Numbers
  1. <a href="news2.asp?id=386&voicetype=All" name="386">
  2. <div class="newsitem">
  3.          <div class="newstxtright"><img src="http://bytes.com/submit/images/newstext/rupert degas.png" border="0"></div>
  4.         <div class="artistboysnewsleft"><img src="http://bytes.com/submit/images/pix/rupertdegas.png" name="boysnewsimg" border="0" class="boysnewsimg">
  5.         <div class="boysnews">Rupert<br>Degas</div></div>
  6. </div></a>
this is the css for the divs on the page
Expand|Select|Wrap|Line Numbers
  1. /* start news */
  2. #newslist {
  3.     margin: 0 auto;
  4.     width: 840px;
  5.     top: 180px;
  6.     /* [disabled]background-color: #FFF; */
  7.     padding: 5px;
  8. }
  9. .newsitem {
  10.     width: 800px;
  11.     border:#ef007b;
  12.     border-style:solid;
  13.     border-width:thin;
  14.     height:155px;
  15.     margin-top: 15px;
  16. }
  17. .artistboysnewsright  {
  18.     /*border: 1px solid #f39617;*/
  19.     width: 85px;
  20.     height: 130px;
  21.     float: right;
  22.     margin-top: 7px;
  23.     margin-right: 7px;
  24.     margin-bottom: 7px;
  25.     margin-left: 7px;
  26.     padding-top: 10px;
  27.     text-align: center;
  28.  
  29. }
  30. .artistboysnewsleft  {
  31.     /*border: 1px solid #f39617;*/
  32.     width: 85px;
  33.     height: 130px;
  34.     float: left;
  35.     margin-top: 7px;
  36.     margin-right: 7px;
  37.     margin-bottom: 7px;
  38.     margin-left: 7px;
  39.     padding-top: 10px;
  40.     text-align: center;
  41.  
  42. }
  43. .newstxtleft {
  44.     float: left;
  45.     margin-top: 17px;
  46.     padding-left: 10px;
  47. }
  48. .newstxtright {
  49.     float: right;
  50.     margin-top: 17px;
  51.     padding-right: 10px;
  52. }
  53. .boysnews {
  54.     background-image: url(../images/newfrontpage/b.gif);
  55.     padding-top: 5px;
  56.     padding-bottom: 5px;
  57.     font-family: Arial, Verdana, sans-serif;
  58.     font-size: 11px;
  59.     font-weight:bold;
  60.     color: #000000;
  61.     text-decoration:none;
  62. }
  63. .girlsnews {
  64.     background-image: url(../images/newfrontpage/f.gif);
  65.     padding-top: 5px;
  66.     padding-bottom: 5px;
  67.     font-family: Arial, Verdana, sans-serif;
  68.     font-size: 11px;
  69.     font-weight:bold;
  70.     color: #000000;
  71.     text-decoration:none;
  72. }
  73. .kidsnews {
  74.     background-image: url(../images/newfrontpage/k.gif);
  75.     padding-top: 5px;
  76.     padding-bottom: 5px;
  77.     font-family: Arial, Verdana, sans-serif;
  78.     font-size: 11px;
  79.     font-weight:bold;
  80.     color: #000000;
  81.     text-decoration:none;
  82. }
  83. .boysnewsimg {
  84.     top: -9px;
  85.     width: 82px;
  86.     height: 82px;
  87. }
  88. .girlsnewsimg {
  89.     top: -9px;
  90.     width: 82px;
  91.     height: 82px;
  92. }
  93. .kidsnewsimg {
  94.     top: -9px;
  95.     width: 82px;
  96.     height: 82px;
  97. }
  98. /* end news */

this is the page in question
http://www.yaketyyak.co.uk/newpages/news.asp

thanks
Aug 9 '12 #1
Share this Question
Share on Google+
2 Replies


Frinavale
Expert Mod 5K+
P: 9,731
You cannot put a <div> within an <a>.
Use a <span> instead and set the span's style to "display:block" so that it behaves like a <div>.

-Frinny
Aug 9 '12 #2

100+
P: 347
ok i have changed it slightly and put the <a> within the outer <div>

Expand|Select|Wrap|Line Numbers
  1. <div class="newsitem">
  2. <a href="news2.asp?id=386&voicetype=All" name="386">
  3.          <span class="newstxtright"><img src="../images/newstext/rupert degas.png" border="0"></span>
  4.         <span class="artistboysnewsleft"><img src="../images/pix/rupertdegas.png" name="boysnewsimg" border="0" class="boysnewsimg">
  5.         <span class="boysnews">Rupert<br>Degas</span></span>
  6.         </a>
  7. </div>
still does not work though??
Aug 9 '12 #3

Post your reply

Sign in to post your reply or Sign up for a free account.