38 users online (0 members and 38 guests)  


  Results 1 to 14 of 14

Related

  1. Unwanted Toolbar    Forum: HTML Forum
    Replies: 1
  2. Unwanted scrollbar gap    Forum: HTML Forum
    Replies: 1
  3. Unwanted link border colors    Forum: HTML Forum
    Replies: 3
  4. Unwanted border outside table    Forum: HTML Forum
    Replies: 3
  5. border shows but I set no border?    Forum: HTML Forum
    Replies: 2
  1. #1
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Unwanted Border on JPEG using CSS

    Hello:
    I am sure this has been asked and answered, but I cannot find the solution.
    I am building a webpage and I have a JPEG I am trying to place on top (z direction) of another JPEG.
    Code:
    <div id="bannerlayer">
    <img src="assets/banners/banner_att.jpg" alt="attorneys" width="460" height="117" style="border:0px"/>
    </div>
    I am using this CSS code:
    Code:
    #bannerlayer {
     position: relative;
     left: 358px;
     top: -543px;
     width:460px;
     height:117px;
     z-index: 3;
     border: 0px solid #000;
    }
    and there is a 1px border around the JPEG I cant get rid of.
    Please help, Thank you in advance...
    dpbklyn
    Last edited by dpbklyn; 06-05-2007 at 08:16 PM. Reason: Cleaning up the "CODE" Tag

  2. #2
    vinyl-junkie's Avatar
    Moderator

    Status
    Offline
    Join Date
    Sep 2005
    Posts
    721

    Re: Unwanted Border on JPEG using CSS

    What you've shown us looks fine, on the surface at least. Post a link to the page in question or else post the page code. That way, we might be able to help.
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more

  3. #3
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    Thank you for your quick response...here is the link to the test site:
    http://www.cio-it.com/test/attorneys.htm
    Thank you,
    dp

  4. #4
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel

    Re: Unwanted Border on JPEG using CSS

    In your example above the image tag conatins the "border: 0px", on the link it does not have that.

    I would just add the border: 0px to the img rule in your css.

    D
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  5. #5
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    I tired that in my experimentation last night, but it didnt work so I removed it. It is back now...and still...

  6. #6
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel

    Re: Unwanted Border on JPEG using CSS

    You say it is back now, but I see no difference in the code.
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  7. #7
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    Sorry, I put it in the img tag on the CSS, I now includded it in the code as well.

    In anticipation ofyour next question, I have icluded the entire CSS code below:
    Code:
    /* Reiss 1024 CSS Document */
    img {
     border-style: none;
     vertical-align:bottom;display:block;
     vertical-align:bottom;
     border: 0px;
     }
     
    #body {
     background-color:#666666;
     }
     
    #global {
         position:absolute;
         left: 50%; 
         top: 50%;
         width: 819px;
         height: 460px;
         margin-top: -200px; /* half of the height */
         margin-left: -410px; /* half of the width */
         border: 0px solid #000;
         }
     
    a { color:#FFFFFF;}
     
    #layer1 {
         position:absolute;
         left: 50%; 
         top: 50%;
         width: 819px;
         height: 400px;
         margin-top: -200px; /* half of the height */
         margin-left: -410px; /* half of the width */
         border: 0px solid #000;
         }
     
    /* BUTTON CODE */
    .atny_cssnav
    {
    position: relative;
    left: 575px;
    top: -299px;
    font-family: arial, helvetica, sans-serif;
    background: url(assets/buttons/b_att_2.jpg) no-repeat;
    white-space: nowrap;
    display: block;
    width: 180px;
    height: 50px;
    margin: 0;
    padding: 0;
    }
    .atny_cssnav a
    {
    display: block;
    color: #000000;
    font-size: 11px;
    width: 180px;
    height: 50px;
    display: block;
    float: left;
    color: black;
    text-decoration: none;
    }
    .atny_cssnav img
    {
    width: 180px;
    height: 50px;
    border: 0
    }
    * html a:hover
    {
    visibility:visible
    }
    .atny_cssnav a:hover img
    {
    visibility:hidden
    }
    .atny_cssnav span
    {
    visibility:hidden
    position: absolute;
    left: 35px;
    top: 15px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    } 
     
     
    .pract_cssnav
    {
    position: relative;
    left: 575px;
    top: -300px;
    font-family: arial, helvetica, sans-serif;
    background: url(assets/buttons/b_practice_2.jpg) no-repeat;
    white-space: nowrap;
    display: block;
    width: 180px;
    height: 50px;
    margin: 0;
    padding: 0;
    }
    .pract_cssnav a
    {
    display: block;
    color: #000000;
    font-size: 11px;
    width: 180px;
    height: 50px;
    display: block;
    float: left;
    color: black;
    text-decoration: none;
    }
    .pract_cssnav img
    {
    width: 180px;
    height: 50px;
    border: 0
    }
    * html a:hover
    {
    visibility:visible
    }
    .pract_cssnav a:hover img
    {
    visibility:hidden
    }
    .pract_cssnav span
    {
    visibility:hidden
    position: absolute;
    left: 35px;
    top: 15px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    }
     
     
    .media_cssnav
    {
    position: relative;
    left: 575px;
    top: -301px;
    font-family: arial, helvetica, sans-serif;
    background: url(assets/buttons/b_media_2.jpg) no-repeat;
    white-space: nowrap;
    display: block;
    width: 180px;
    height: 50px;
    margin: 0;
    padding: 0;
    }
    .media_cssnav a
    {
    display: block;
    color: #000000;
    font-size: 11px;
    width: 180px;
    height: 50px;
    display: block;
    float: left;
    color: black;
    text-decoration: none;
    }
    .media_cssnav img
    {
    width: 180px;
    height: 50px;
    border: 0
    }
    * html a:hover
    {
    visibility:visible
    }
    .media_cssnav a:hover img
    {
    visibility:hidden
    }
    .media_cssnav span
    {
    visibility:hidden
    position: absolute;
    left: 35px;
    top: 15px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    }
     
     
    .contact_cssnav
    {
    position: relative;
    left: 575px;
    top: -302px;
    font-family: arial, helvetica, sans-serif;
    background: url(assets/buttons/b_contacts_2.jpg) no-repeat;
    white-space: nowrap;
    display: block;
    width: 180px;
    height: 50px;
    margin: 0;
    padding: 0;
    }
    .contact_cssnav a
    {
    display: block;
    color: #000000;
    font-size: 11px;
    width: 180px;
    height: 50px;
    display: block;
    float: left;
    color: black;
    text-decoration: none;
    }
    .contact_cssnav img
    {
    width: 180px;
    height: 50px;
    border: 0
    }
    * html a:hover
    {
    visibility:visible
    }
    .contact_cssnav a:hover img
    {
    visibility:hidden
    }
    .contact_cssnav span
    {
    visibility:hidden
    position: absolute;
    left: 35px;
    top: 15px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    } 
    /* END BUTTON CODE */
     
    /*BEGIN ATTNY LINKS on ATTORNEY PAGE*/
    #attny1layer {
     position: relative;
     left: 170px;
     top: -275px;
     width:150px;
     height:40px;
     z-index:3;
    }
    #attny2layer {
     position: relative;
     left: 170px;
     top: -260px;
     width:150px;
     height:40px;
     z-index:3;
    }
    .style1 {
     color: #ffffff;
     font-size: 14px;
     text-align:center;
     font-family: Arial, Helvetica, sans-serif;
    }
    /*BEGIN BANNER STYLES*/
    #bannerlayer {
     position: relative;
     left: 358px;
     top: -543px;
     width:460px;
     height:117px;
     z-index: 3;
     border: 0px solid #000;
    }

  8. #8
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel

    Re: Unwanted Border on JPEG using CSS

    Anybody a little better at CSS than I?(heck almost everybody is )
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  9. #9
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel

    Re: Unwanted Border on JPEG using CSS

    You may want to run the CSS through the validator as well. There is an interface if you follow the navigation link above to the webmaster tools.

    D
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  10. #10
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    Thank you! I ran it through the validator, and found some other errors that I fixed, but I am still having the problem with the border around the JPEG...
    Last edited by dpbklyn; 06-06-2007 at 09:16 AM. Reason: spelling

  11. #11
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    It looks like this was caused by ant-aliasing being turned on when my graphic artist created the JPEG.
    I am having him re-do the banner and asking him to make the BG one color.
    I will letyou know if it works.
    THANK YOU for all your help!

  12. #12
    dpbklyn's Avatar
    New User

    Status
    Offline
    Join Date
    Jun 2007
    Posts
    20

    Re: Unwanted Border on JPEG using CSS

    OK...That was it. My graphic designer left the white anti-alising boarder arund the JPEG.

    Thank you for all your help, I am now an indebted meber of this community!

    dp

  13. #13
    vinyl-junkie's Avatar
    Moderator

    Status
    Offline
    Join Date
    Sep 2005
    Posts
    721

    Re: Unwanted Border on JPEG using CSS

    Is this fixed now? I looked at it in both IE and FF, and it looks fine to me.
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more

  14. #14
    ecbiz's Avatar
    New User

    Status
    Offline
    Join Date
    Jan 2007
    Posts
    11

    Re: Unwanted Border on JPEG using CSS

    I've done this in the past without using the style property. eg
    <img src="xbox-360-games-images/c-mcrae-xbox.png" alt="Colin McRae DIRT 24.99" width="104" height="172" id="McRae" border='0'/>

    Hope this helps
    Last edited by HTML; 07-27-2007 at 06:17 PM. Reason: Sig belongs in profile.



Tags for this Thread