Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Apr 2009
    Posts
    8
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Unhappy Link colour problem in IE

    I'm currently designing a website in css and it shows up fine in Firefox but not in IE, heres the link www.sibilanguages.com now if you open it in firefox you'll see the english and the german flag on the top left corner without any border or such but if you open it in IE you get to see an ugly blue border around it, i cant seem to figure out why, i've gone through the css a million times but i dont know what im doing wrong. PLease help!

    and thanx for the help!

    Code:
    /***************************************************
       HTML Element Styles
     ***************************************************/
    
    body {
      margin: 0;  
      text-align: center;
      font: 0.62em verdana, arial, sans-serif;  
      line-height: 170%;
      color: #EEE;
      background: #585858 url(../images/bg_body.jpg) repeat-y top center;
    }
    
    p { 
      padding-top: 10px !important;
      padding-top: 3px;
      padding-bottom: 10px !important;
      padding-bottom: 3px;
    }
    
    
    /*a {
      color: #86E160;
    }
    
    a:visited {
      color: #AAA;
    }
    
    a:hover {
      color: #FFF;
    }*/
    
    acronym {
      cursor: help;
      border-bottom: 1px solid #777;
    }
    
    input {
      width: 70%;
    }
    
    textarea {
      width: 98%;
    
    }
    
    input,
    textarea {
      padding: 1px 3px;
      margin: 5px 0;
      font: 1em verdana, arial, sans-serif;
      color: #EEE;
      background-color: #777;
      border: 1px solid #999;
    }
    
    input:hover,
    input:focus,
    textarea:hover,
    textarea:focus {
      color: #FFF;
      background-color: #999;
      border: 1px solid #EEE;
    }
    
    
    h1 {
      clear: both;
      margin: 10px 0;
      font: 700 1em verdana, sans-serif;
      text-transform: uppercase;
      color: #7BD32C;
      background: #686868 url(../images/rounded_tr.gif) no-repeat top right;
    }
    
    h1 span {
      display: block;
      padding: 2px;
      background: url(../images/rounded_br.gif) no-repeat bottom right;
    }
    
    #sideBar h1 {
      text-align: right;
      background: #686868 url(../images/rounded_tl.gif) no-repeat top left;
    }
    
    #sideBar h1 span {
      display: block;
      padding: 2px;
      background: url(../images/rounded_bl.gif) no-repeat bottom left;
    }
    
    
    #content ol li { 
      color: #9BE4FF;
    }
    
    #content ol li span {
      color: #EEE;
    }
    
    #content ul {
      padding-bottom: 10px;
    }
    
    #content ul li {
      list-style-image: url(../images/li_bullet.gif);
    }
    
    blockquote {  
      margin: 0;
      background: #686868 url(../images/rounded_tr.gif) no-repeat top right;
    } 
    
    blockquote span {
      display: block;
      padding: 5px;
      background: url(../images/rounded_br.gif) no-repeat bottom right;
    }
    
    /***************************************************
      Layout Element Styles
     ***************************************************/
    
    
    #header {  
      width: 100%;
      height: 3em;
      background: #585858 url(../images/bg_header.jpg) repeat-y top center;  
    }
    
    /***************************************************
      Header Menu
     ***************************************************/
    
    #menu {
    	width: 767px;
    	margin: 0 auto;
    	text-align: left;
    	padding-left: 10px;
    }
    
    #menu ul {
      margin: 0;
      padding: 0;
      line-height: normal;  
    }
    
    #menu ul li {
      width: 8em;
      display: inline;
      float: left;
      padding-top: 0.8em;  
      list-style: none;
      text-align: center;
    }
    
    #menu ul li a {
      display: block;
      text-decoration: none;
      text-transform: uppercase;
      padding-bottom: 1.0em;
      color: #222;
    }
    
    #menu ul li a:hover,
    #menu ul li a.active {
    	font-weight: bold;
    	color: #000000;
    }
    
    
    /***************************************************
      Site Title
     ***************************************************/
    
    #title {
      padding: 0.6em 5px 0.6em 0;
      margin-right: 0.5em;
      float: right;
    }
    
    #title h1 {
    	display: inline;
    	color:  #222;
    	background-color: #86E160;
    	background-image: none;
    }
    
    #title2 {
      padding: 0.6em 5px 0em 0;
      margin-left: 0.5em;
      float: left;
    }
    
    #title2 h1 {
    	display: inline;
    	color:  #222;
    	background-color: #86E160;
    	background-image: none;
    }
    
    
    /***************************************************
     Page Content
     ---------------------------------------------------
     1. Left side text
     2. Dropdown image
     3. Right side bar 
     ***************************************************/
    
    
    #content {  
      clear: both;
      width: 767px;
      margin: 0 auto;
      text-align: left;
    }
    
    #text {
      float: left;
      width: 130px!important;
      width: 130px;
      padding: 10px 5px 20px 20px !important;
      padding: 20px 5px 20px 20px;
    }
    
    #image {
      float: left;
      width: 220px;  
      vertical-align: top;
    }
    
    #sideBar {
      float: right;
      width: 370px!important;
      width: 400px;
      padding: 10px 15px 20px 0 !important;
      padding: 20px 15px 20px 0;
    }
    
    
    /***************************************************
     Sidemenu Styles
     ***************************************************/
    
    .sideMenu {
      padding: 15px 0;
    }
    
    .sideMenu a {
      display: block;
      text-align: right;
      text-decoration: none;
      margin-bottom: 1px;  
    }
    
    .sideMenu a span {
      display: block;
      padding: 1px;
    }
    
    /*.sideMenu a:hover {
      background: #686868 url(../images/rounded_tl.gif) no-repeat top left;
    }
    
    .sideMenu a:hover span {
      background: url(../images/rounded_bl.gif) no-repeat bottom left;
    }*/
    
    /***************************************************
     Comment Styles
     ***************************************************/
    
    #comments p {
      padding: 0 5px;
      margin-bottom: 0;
      background: #686868 url(../images/rounded_tl.gif) no-repeat top left;
    }
    
    #comments p span.author {
      display: block;
      margin-top: 5px;
      text-align: right;
      font-weight: 700;
    }
    
    #comments img {
      margin-top: -1px;
    }
    
    /*#comments a {
      color: #7BD32C;
    }
    
    #comments a:visited {
      color: #AAA;
    }
    
    #comments a:hover {
      color: #FFF;
    }*/
    
    /***************************************************
     Footer
     ***************************************************/
    
    #footer {
      clear: both;
      float: right;
      width: 500px;
      padding: 10px 20px;
      color: #888;
    }
    
    #footer p {
      padding-top: 0 !important;
      padding-top: 10px;
    }
    
    #footer a {
      color: #888;
    }
    
    #footer a:hover {
      color: #EEE;
    }
    
    
    /***************************************************
     Generic Display Classes
     ***************************************************/
    
    .center {
      text-align: center;
    }
    
    .noPad {
      padding: 0;
      margin: 0;
    }
    
    .left {
      float: left;
    }
    
    .right {
      float: right;
    }
    
    img.left {
      padding: 5px 5px 5px 0;
    }
    
    img.right {
      padding: 5px 0 5px 5px;
    }
    
    .button {
      width: auto;
      cursor: pointer;
    }
    
    .date {
      display: block;
      font-weight: 700;
    }
    Last edited by hissam; 04-16-2009 at 09:46 AM.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Just add
    Code:
    a img{
    border:none;
    }
    into your CSS

    PS: please wrap your code with [CODE][/CODE] tags while posting here, you may edit your above post.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    hissam (04-16-2009)

  • #3
    Regular Coder
    Join Date
    Sep 2008
    Posts
    106
    Thanks
    27
    Thanked 3 Times in 3 Posts
    hissam,
    I think that you should add the border="0" in your img tags:

    Code:
    <img height="14" width="20" alt="" border="0" src="images/english-dark.jpg"/>
    <img height="14" width="20" alt="" border="0" src="images/german.jpg"/>

  • Users who have thanked ktsixit for this post:

    hissam (04-16-2009)

  • #4
    New to the CF scene
    Join Date
    Apr 2009
    Posts
    8
    Thanks
    3
    Thanked 0 Times in 0 Posts
    thanx abduraooft and ktsixit

    both worked!!! you guys are amazing! and thanx for the fast reply!!!!

    wohoo!!!!

  • #5
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Quote Originally Posted by ktsixit View Post
    hissam,
    I think that you should add the border="0" in your img tags:

    Code:
    <img height="14" width="20" alt="" border="0" src="images/english-dark.jpg"/>
    <img height="14" width="20" alt="" border="0" src="images/german.jpg"/>
    No! border is a deprecated attribute.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #6
    Regular Coder
    Join Date
    Sep 2008
    Posts
    106
    Thanks
    27
    Thanked 3 Times in 3 Posts
    ok! ok! Just tried to help!

    I just use this all the time and it works fine. Why is it deprecated?

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    I just use this all the time and it works fine. Why is it deprecated?
    W3 decided to keep the data and styling information separate and thus attributes like align, color, bgColor, border etc all are deprecated now. See a list of other such tags and attributed at http://www.evotech.net/blog/2007/07/...nd-attributes/
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #8
    Regular Coder
    Join Date
    Sep 2008
    Posts
    106
    Thanks
    27
    Thanked 3 Times in 3 Posts
    I was not aware of that, thank for this


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •