11 Replies Latest reply: Apr 12, 2012 5:46 AM by YMK1966 RSS

    I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase

    YMK1966

      I have a hyperlink in my SQL database which displays from a recordset on my page. It has an image link which displays with a very annoying blue border around it.

       

      Because it is not an image (as such), I cannot just select it and change the border to 0.

       

      When I go to CSS, it just lets me set the border of the table it is presented in!!!

       

      Can somebody point me in the right direction, Please!

        • 2. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
          YMK1966

          Yes, I've already read that in other discussions - I can't actually establish which CSS style element applies to my image link though!!

          • 3. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
            John Waller MVP

            Please post a link to your website and we can offer some specific suggestions.

            • 4. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
              YMK1966

              Hi,

               

              Thanks,

               

              Please bear in mind that I have only just put it up and a couple, including the front index page, is not finished.  The blue box displays on the product detail page, then you have selected an actual item to view in detail.

               

              www.thefabulousgiftstore.co.uk

               

              Thanks

              • 5. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                osgood_ MVP

                I don't see any blue link around any image? can you provide a page and product. If I go to GISELA GRAHAM I get a set of images displayed (no blue border around any of them when I click) This takes me to a details/price page. The only border I see around any image on those pages is a grey border around the 'add to shopping bag' image. What browser is this happening in?

                • 6. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                  YMK1966

                  That is the border I can't get rid of; you don't see it in Safari on a mac, only in Internet Explorer on a pc.  It is really bugging me that I can't get rid of it.

                   

                   

                  Thanks

                  • 7. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                    osgood_ MVP

                    a img {

                    border: none;

                    }

                     

                    should work if you add it to the css styles already in the <head></head> section of the details page. Have you tried that?

                     

                    If not add id="shopButton" to the <td> cell that the image appears in (see below)

                     

                     

                    <td height="37" id="shopButton" align="center" style="padding: 5px;"><a href="http://ww6.aitsafe.com/cf/add.cfm?userid=87488926&product=Gisela+Graham+Wooden+Heart+Lette rs&price=23.99&return=www.thefabulousgiftstore.co.uk"><img src="Images/shopping_bag.png" Alt="Buy now!" ></td>

                     

                    then add to the css styles:

                     

                    #shopButton a img {

                    border: none;

                    }

                     

                     

                    Try both the above and then post back if it doesnt work.

                    • 8. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                      YMK1966

                      Hi, this is the code I see in my view as an SQL statement calls for the link from the database:

                       

                       

                      <td height="37" align="center" style="padding: 5px;"><?php echo $row_rsProducts['Buy Now']; ?>

                                <td height="37"id="ShopButton"align="center"style="padding: 5px;"><br /></td>

                       

                      ********************

                       

                      Don't know whether I am doing it right but this is where I have put the code in the head section, still not working and got the grey border.

                       

                       

                      <style type="text/css">

                      #wrapper #main #topbody table tr td {

                                text-align: justify;

                                font-size: 10px;

                                color: #555;

                                font-style: normal;

                                font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

                                border-top-color: #FFF;

                                border-right-color: #FFF;

                                border-bottom-color: #FFF;

                                border-left-color: #FFF;

                                border-top-style: none;

                                border-right-style: none;

                                border-bottom-style: none;

                                border-left-style: none;

                                background-color: #FFF;

                       

                      }

                      #wrapper #main #leftmenu table tr td {

                                border-top-width: thin;

                                border-right-width: thin;

                                border-bottom-width: thin;

                                border-left-width: thin;

                                border-bottom-style: solid;

                                border-top-color: #EBEBEB;

                                border-right-color: #EBEBEB;

                                border-bottom-color: #EBEBEB;

                                border-left-color: #EBEBEB;

                                padding-left: 10px;

                                font-size: 12px;

                                color: #6D6D6D;

                                font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

                                #shopButton a img {

                       

                       

                      border: none;

                      }

                      #BuyNow {

                                border-top-width: 0px;

                                border-right-width: 0px;

                                border-bottom-width: 0px;

                                border-left-width: 0px;

                                border-top-color: #FFF;

                                border-right-color: #FFF;

                                border-bottom-color: #FFF;

                                border-left-color: #FFF;

                                a img {

                                          #shopButton a img {

                       

                       

                      border: none;

                      #shopButton a img {

                      border: none;

                      }

                      }

                      border: none;

                       

                       

                      }

                       

                      I am stumped!!

                      • 9. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                        osgood_ MVP

                        YMK1966 wrote:

                         

                        Hi, this is the code I see in my view as an SQL statement calls for the link from the database:

                         

                         

                        <td height="37" align="center" style="padding: 5px;"><?php echo $row_rsProducts['Buy Now']; ?>

                                  <td height="37"id="ShopButton"align="center"style="padding: 5px;"><br /></td>

                         

                        ********************

                         

                        Don't know whether I am doing it right but this is where I have put the code in the head section, still not working and got the grey border.

                         

                         

                         

                        Css is case sensitive so id="ShopButton" won't work - it needs to be a lower case 's' for shop like id="shopButton"

                         

                         

                         

                         

                         

                        YMK1966 wrote:

                         

                         

                         

                        border: none;

                        }

                        #BuyNow {

                                  border-top-width: 0px;

                                  border-right-width: 0px;

                                  border-bottom-width: 0px;

                                  border-left-width: 0px;

                                  border-top-color: #FFF;

                                  border-right-color: #FFF;

                                  border-bottom-color: #FFF;

                                  border-left-color: #FFF;

                                  a img {

                                            #shopButton a img {

                         

                         

                        border: none;

                        #shopButton a img {

                        border: none;

                        }

                        }

                        border: none;

                         

                         

                        }

                         

                        I am stumped!!

                         

                        Then get rid of the repeated #shopButton a img { border: none }; and the stray border: none; in your css above so you are left with:

                         

                        #BuyNow {

                                  border-top-width: 0px;

                                  border-right-width: 0px;

                                  border-bottom-width: 0px;

                                  border-left-width: 0px;

                                  border-top-color: #FFF;

                                  border-right-color: #FFF;

                                  border-bottom-color: #FFF;

                                  border-left-color: #FFF;

                        }

                         

                        #shopButton a img {

                        border: none;

                        }

                        • 10. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                          osgood_ MVP

                          You have another repeated one after the 'wrapper' css selector. Please delete it and make sure the css selector has its closing bracket }.

                           

                          #wrapper #main #leftmenu table tr td {

                                    border-top-width: thin;

                                    border-right-width: thin;

                                    border-bottom-width: thin;

                                    border-left-width: thin;

                                    border-bottom-style: solid;

                                    border-top-color: #EBEBEB;

                                    border-right-color: #EBEBEB;

                                    border-bottom-color: #EBEBEB;

                                    border-left-color: #EBEBEB;

                                    padding-left: 10px;

                                    font-size: 12px;

                                    color: #6D6D6D;

                                    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

                                    #shopButton a img {

                           

                           

                          border: none;

                          }

                          • 11. Re: I cannot get rid of an annoying blue box on an image link that displays from a hyperlink in my dbase
                            YMK1966

                            I have just fathomed out what it is; the page properties in my template have the hyperlink roll over colours and behaviours set; the link for the 'add to shopping bag' button was picking up the hyperlink rollover properties.

                             

                            I have changed these and the colour of my 'add to bag' button to match - whilst this is not ideal I do not know how to isolate the shopping bag hyperlink so that it does not pick up the values from the page properties; is there a way I can do this????