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 5 of 5
  1. #1
    New Coder
    Join Date
    Nov 2010
    Posts
    76
    Thanks
    13
    Thanked 3 Times in 3 Posts

    text-decoration:none in Links for IE??

    I have some VERY simple code here just to figure out WTF to do for links text decoration in stupid ***** IE!

    SO I built a simple menu with images as the menu with javascript onmouse events.
    Code:
    <div id="head">
    <ul class="menu">
      <li>
        <a href="#" onmouseover="" onmouseout=""><img src="" id="1" /></a>
      </li>
    </ul>
    </div>
    ok so I made like 5 links like this for the nav menu. then I styled the whole thing so that if floats left an list has no style, at the top with no margin blah,blah,blah. the code for making these links decoration go way for IE isn't working at all.
    so far i used :
    Code:
    #head{
        height:20px; //height of the imgs
        width:1280px; // width of all the imgs floating left
        margin:0;
        padding:0;
    }
    //Ive tried all of these combos below
    /* .menu li a{
      text-decoration:none
    }
        .menu li a{
    text-decoration:none;
    }
    .menu a{}// tried this alone and with all the pseudo classes as well 
    .menu li a:link{text-decoration:none}
    .menu li a:visited{text-decoration:none}
    .menu li a:active{text-decoration:none}
    .menu li a:hover{text-decoration:none}
    .menu li a:focus{text-decoration:none}
    */
    I'm lost and sick of stupid IE .. I wish we didn't have to code for them asswads.
    Any Help.. much thanks

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello joanzn,
    .menu li a {text-decoration: none;} should work fine. You just have some stuff above it that is messing you up.
    You are not commenting your CSS correctly when you use //
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #3
    New Coder
    Join Date
    Nov 2010
    Posts
    76
    Thanks
    13
    Thanked 3 Times in 3 Posts
    Ya it doesn't work at all .. this isn't my code i was just typing out all the combos I've used. and i don't have comments // in the code. but ya .. you would think that would work but it doesn't. .. I'll post my actual code in a sec n see what you think

    HTML:
    Code:
    <div id="wrapper">
        <div id="header">
            <ul class="head">
                <li><img alt="heading" src="images/header/h1_01.png" /></li>
                <li><a href="#" onmouseover="document.getElementById('1').src='images/header/h2_02.png'" onmouseout="document.getElementById('1').src='images/header/h1_02.png'"><img alt="home" src="images/header/h1_02.png" id="1" /></a></li>
                <li><a href="#" onmouseover="document.getElementById('2').src='images/header/h2_03.png'" onmouseout="document.getElementById('2').src='images/header/h1_03.png'"><img alt="comment" src="images/header/h1_03.png" id="2" /></a></li>
                <li><a href="#" onmouseover="document.getElementById('3').src='images/header/h2_04.png'" onmouseout="document.getElementById('3').src='images/header/h1_04.png'"><img alt="develop" src="images/header/h1_04.png" id="3" /></a></li>
                <li><a href="#" onmouseover="document.getElementById('4').src='images/header/h2_05.png'" onmouseout="document.getElementById('4').src='images/header/h1_05.png'"><img alt="search" src="images/header/h1_05.png" id="4" /></a></li>
                <li><a href="#" onmouseover="document.getElementById('5').src='images/header/h2_06.png'" onmouseout="document.getElementById('5').src='images/header/h1_06.png'"><img alt="login" src="images/header/h1_06.png" id="5" /></a></li>
                <li><img alt="heading" src="images/header/h1_07.png" /></li>
    
            </ul>
        </div>
        <div id="content"></div>
        <div id="footer"></div>
        </div>
    css:
    Code:
    html
    {
         background: url(images/bg.jpg) no-repeat center center fixed;
         -webkit-background-size: cover;
         -moz-background-size: cover;
         -o-background-size: cover;
         background-size: cover;
    	 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.back.png', sizingMethod='scale');
         -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='back.png', sizingMethod='scale')";
    	 z-index:-1;
        }
    body 
    {
        margin:0;
        padding:0;
    }
    #wrapper
    {   margin:0 auto 0 auto;
        padding:0;
        width:1280px;
        height:auto;
        }
    #header
    {   margin:0;
        padding:0;
        height:20px;
        width:1280px;
        }
    
    .head
    {
        position:absolute;
        margin:0;
        padding:0;
        width:1380px; /* it's suppose to be 1280px but with the stupid link borders IE f's it up*/
        height:20px;
    }
    .head li
    {   margin:0;
        padding:0;
        list-style-type:none;
        float:left;
        }
    .head li a{text-decoration:none;}
    #content{}
    #footer{}
    Last edited by joanzn; 10-27-2011 at 09:42 PM.

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    .head li a {text-decoration:none;} is working.

    Could it be what you are seeing is the blue box IE insists on putting around images?
    Add this bit to test: .head img {border: none;}
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    joanzn (10-27-2011)

  • #5
    New Coder
    Join Date
    Nov 2010
    Posts
    76
    Thanks
    13
    Thanked 3 Times in 3 Posts
    Stupid IE want's
    Code:
    img{border:0;}
    That took awhile!
    thanks fer the help tho!


  •  

    Posting Permissions

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