• my site : https://zooyorkfreak.com (totally safe for work)

    If you view my site in firefox everything looks beautiful. When you look at it in IE it turns to trash.

    When ever you roll over any link on the page it automatically creates a break and screws up the page. Roll over a sidebar link and it adds a phantom break between the links.

    I have been cleaning up my CSS .. and now it just looks horrible becuase of this issue.

    Please someone help me.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    In your CSS:

    .commentmetadata a, a:hover, a:visted {
    	font-weight: normal;
             color: #FF6600;
    	margin: 0px;
    	display: block;
    	}

    The “display:block” is your issue here. You’re changing the link from inline to block style on hover (a:hover), which means it should have a line break after it.

    Also, “visited” is misspelled. Might want to consider running things through a validator or three.

    Thread Starter bcinelli

    (@bcinelli)

    I’m sorry. I been teaching myself CSS throught the WROX book and going back on a pre-made theme that someone had made before. I should of run it through a validator before posting you are right.

    I just have one question after I implemented what you said.

    What does the .commentmetadata have to do with post titles and sidebar stuff?

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    What does the .commentmetadata have to do with post titles and sidebar stuff?

    Nothing at all. But you’re not applying that to just the links in the commentmetadata. The comma starts a whole new type definition, so that’s three different definitions in one right there. “a:hover” is *every* link on the whole page.

    Thread Starter bcinelli

    (@bcinelli)

    I think I now know what your getting at once you place that , it starts a new definition .. in this case a:hover doesn’t have to be releated to .commentmetadata at all but instead the whole pages a:hover.

    I think I now know my problem.

    So its best to write the css as follows?

    .commentmetadata a {
    font-weight: normal;
    color: #ff6600;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    }

    .commentmetadata a:hover {
    ‘its own properties’
    }

    .commentmetadata a:visited {
    ‘its own properties’
    }

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    Well, there’s nothing wrong with comma separation like that, just be explicit about what you’re referring to. Use .commentmetadata a:hover instead of just a:hover.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Site is handling things WAY different in IE changing all links’ is closed to new replies.