Grow your CSS skills. Land your dream job.

[Solved] Any idea why this is shifting?

  • # September 20, 2010 at 2:41 am

    http://www.abrahamkinney.com

    my main content area is fine in Firefox/Chrome/Safari but Opera and IE shift my main content area/sidebar get a huge shift. Any help greatly appreciated. Thanks.

    # September 20, 2010 at 5:21 am

    Somewhere error in HTML code. Like this




      not close. And Just close this tag, and everything will fall into place.



      Opera and IE bad interprets the code and responds poorly to mistakes.
      sweet cat :)

      # September 20, 2010 at 1:28 pm

      You have 2 body tag openings.
      And this needs fixing:



      Validate to find other mistakes.

      It’s not Opera(or IE) fault when your code has errors :)

      # September 20, 2010 at 7:29 pm

      As others have mentioned there seems to be a few unbalanced tags in your code. A quick fix of them should solve your problem. Get the web developer tool bar for firefox, you can validate your code straight from there. (There are plenty of other ways as well).

      # September 21, 2010 at 1:07 am

      thank you guys so much. i feel like a total moron. it is so easy to assume it is IE – i got lazy and forgot to double check my code. I am going through the rest of it to double check. Have one more question, though, that I didn’t see a validation reason as the cause – now that my positioning is almost there my little page dependent header graphics (upper right of the main content area on each page – a pencil for illustration, etc…) are not fitting into where they should. Will I need a conditional IE style for this or is it something else?

      # September 21, 2010 at 2:29 am

      Set “page_icon” position: absolute and top: 0; right: 0 or flow:right. And set background-repeat:no-repeat. This is a quick way. It is more convenient to use probably wakes background for “page_head”, not very good to use as tag “img”.

      But your div “page_head” not to be position: absolute, let it just goes in the flow “main_content”.

      And in place http://abrahamkinney.com/contact can also reduce the amount of code.

      Do not use a common position: absolute. This is a bad way.

      # September 22, 2010 at 1:03 am

      @trav – that worked perfect. any idea why IE put a little image icon over my ‘page_icon’? Can I email you?

      # September 22, 2010 at 2:49 am

      Do not use both the tag “img” so, replace

       
    Viewing 8 posts - 1 through 8 (of 8 total)

    You must be logged in to reply to this topic.

    *May or may not contain any actual "CSS" or "Tricks".