5 Replies Latest reply: Apr 9, 2012 6:55 PM by Timber%% RSS

    Ap Div Outline Noise

    Timber%% Community Member

      Hello

      I created a series of AP DIVs 220 x 220

      I then inserted a rollover image 220 x220

      What happens is that when I click the rollover the border area paints a faint square outline.
      What I need is to rollover the link without that annoying faint outline showing up.
      I would appreciate any advise. Here's is an image. The top rollover shows the highlight noise.
      If the viewer could simply rollover without the box asserting itself that would help. I inserted two sets.

      Thanks

      Rollever.jpgRollever2.jpg

        • 1. Re: Ap Div Outline Noise
          Ken Binney MVP

          Use thiss CSS

          a img {
          text-decoration: none;
          border: 0 none;
          }

           

          And be sure your image canvas is transparent

          i.e Gif or png

          • 2. Re: Ap Div Outline Noise
            Timber%% Community Member

            I failed in getting this to work. I inserted a img after every } instance in an attempt to render the faint border invisible and just couldn't get it to work.

            Maybe I am missing the obvious. Let me know. Thanks Chuck M

             

            #pageContainer {

            width: 720px;

            margin: 0 auto;

            }

            #navHolder a {

            width: 120px;

            float: left;

            }

            body {

            font: 11px Verdana, Arial, Helvetica, sans-serif;

            color: #474F49;

            background-color: #FFFFFF;

            margin: 0px;

            padding: 0px;

            }

            #tableLayout {

            background-color: #FFFFFF;

            border-right: 1px solid #B0B0B0;

            border-left: 1px solid #B0B0B0;

            }

            #tableLayout, #tableLayout td {

            border-collapse: collapse;

            }

            #tableLayout td {

            padding: 15px 30px;

            }

            #tdLogo {

            width: 140px;

            background-color: #474F49;

            text-align: center;

            }

            #tableLayout #tdNavigation {

            padding-bottom: 0px;

            background-color: #6E7970;

            text-align: center;

            }

            /*

            #tdNavigation a {

            margin-right: 8px;

            margin-left: 8px;

            display: block;

            float: left;

            }

            */

            #tableLayout #tdFooter {

            background-color: #FBFCF9;

            border-top: 1px solid #D7DACE;

            padding: 10px;

            color: #9CA79D;

            text-align: right;

            }

            p {

            line-height: 1.7em;

            margin-top: 0px;

            text-align: justify;

            }

            #tableLayout #tdSidebar {

            background-color: #E3E5DC;

            vertical-align: top;

            padding-top: 50px;

            background-image: url(../Kalki/kalki_f/images/navigation/sidebarbackground.gif);

            background-repeat: no-repeat;

            background-position: bottom;

            }

            h1 {

            font: normal 20px Georgia, "Times New Roman", Times, serif;

            color: #68887C;

            margin-top: 0px;

            margin-bottom: 12px;

            }

            h2 {

            font-size: 11px;

            font-weight: bold;

            color: #949D87;

            border-left: 11px solid #D7DACE;

            padding-left: 7px;

            }

            #tableLayout #tdSidebar a {

            padding: 8px;

            border-top: 1px solid #CED2B6;

            border-bottom: 1px solid #CED2B6;

            display: block;

            margin-bottom: 10px;

            text-decoration: none;

            }

            #tableLayout #tdSidebar a.current {

            background-color: #F6F7F3;

            }

            #tableLayout #tdSidebar a:link,

            #tableLayout #tdSidebar a:visited,

            #tableLayout #tdSidebar a:active

            {

            color: #474F49;

            }

            #tableLayout #tdSidebar a:hover {

            background-color: #FBFCF9;

            }

            #tableLayout #tdContent {

            padding-right: 58px;

            }

            a img {

            border: none;

            }

            #divCopyright {

            font-size: 10px;

            margin: 1em;

            text-align: center;

            }

            #divCopyright a {

            color: #474F49;

            }

            a:link {

            color: #92D7C1;

            text-decoration: underline;

            }

            #tableLayout #tdContent td {

            padding: .5em;

            vertical-align: top;

            }#apDiv1 {

            position:absolute;

            left:87px;

            top:241px;

            width:487px;

            height:455px;

            z-index:1;

            }

            #apDiv2 {

            position:absolute;

            left:-323px;

            top:218px;

            width:1206px;

            height:5213px;

            z-index:1;

            }

            .style5 {font-size: 11px}

            .style12 {font-size: 10px; color: #339999; }

            .style13 {font-size: 12px; color: #339999; }

            .style20 {font-size: 11px; font-family: "Times New Roman", Times, serif; }

            .style21 {font-family: "Times New Roman", Times, serif}

            .style23 {font-size: 12px; color: #339999; font-family: "Times New Roman", Times, serif; }

            a:visited {

            text-decoration: underline;

            color: #D9ECBA;

            }

            a:hover {

            text-decoration: none;

            color: #D2ECEA;

            }

            a:active {

            text-decoration: underline;

            color: #F9EAC7;

            }

            • 3. Re: Ap Div Outline Noise
              Ken Binney MVP

              Please...

               

              Let's do this the easy way.

              Please upload your files to webspace somewhere, and post a link to your page

              • 4. Re: Ap Div Outline Noise
                ALsp Community Member

                Add these 2 rules to your style sheet:

                 

                a img {border: none;}

                a:focus {outline: none;}

                 

                Al Sparber - PVII

                http://www.projectseven.com

                The Finest Dreamweaver Menus | Galleries | Widgets

                Since 1998

                • 5. Re: Ap Div Outline Noise
                  Timber%% Community Member

                  a img {border: none;}

                  a:focus {outline: none;}

                   

                  That did it ; very clean, very smooth ; thank you!