Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

CSS & HTML: Help?

Bottom of Page

1 to 20 of 20

  1.  
  1.  permalink
    Ok, this is my first time attempting a 2 column layout. Behind my times? Maybe a little. So, I've got it to work in FF... however it doesn't work in IE7 or 6 or 5 I'm betting...

    http://collectivepet.org/main.php

    I'm just coding the site and tyring to work off someone else's design

    Can anyone tell me how to fix this?
    •  
      CommentAuthornifkin
    • CommentTimeFeb 14th 2006
     permalink
    One simple suggestion to start with: I'd recommend against trying to do it as XHTML 1.1. Since you're not sending it with the right MIME types for XHTML1.1 it defeats the purpose anyway, and if you do start switching the MIME types then you're in for a whole other world of hurt in your CSS. Try switching it to XHTML1.0 transitional to be safest.

    Another small suggestion: don't put that comment before the doctype, that will throw IE/PC into quirks mode and all your size measurements will be off.

    That said: I'd put a wrapper div around everything you've got there, then float the left bar inside it and margin-left the content area off of it.
  3.  permalink
    First of all, your're not using XHTML at all.

    Something like,

    div#menu { float: left; width: XXX; }
    div#content { margin-left: XXX; }

    Div#Menu should come before (order wise) the Div#Content in the markup.
  4.  permalink
    I've never had a problem with sending XHTML 1.1 as application/xhtml+xml before. Hell, I've never had a problem getting naything to work in it either. So i did as you guys suggested concerning the immediate problem... now, in IE, the content appears below menu on screen.
    • CommentAuthorNick Presta
    • CommentTimeFeb 15th 2006 edited
     permalink
    Don't define a width on your content. Define it on your body and let your content fill that.

    Also, IE messes up measurements sometimes so leaving 2px of space between the menu and your content won't look the same. Use an IE conditional statement to add more margin or just increase it globally.

    And you're not sending XHTML as application/xhtml+xml, you're serving it as text/html!
  6.  permalink
    Ok, now it's cool in IE... but NOW in ff it doesnt recognize the menu div as being inside the body and so the body area shrinks and grows with content div ONLY. Where as, in IE, it grows with both of them.
  7.  permalink
    also, isn't setting the meta to application/xhtml+xml serving is as application/xhtml+xml?
  8.  permalink
    also, isn't setting the meta to application/xhtml+xml serving is as application/xhtml+xml?

    No, you have to tie your content type in your headers or directly in your Apache config.
  9.  permalink
    well it IS int he header... ah well, I don't see this as being as much a problem as my current problem... any solutions?
  10.  permalink
    You are sending your document as text/html in the header.

    I gave you an answer.
  11.  permalink
    Right and that worked, but then I said I had a new problem that I was hoping for some help for.
    Ok, now it's cool in IE... but NOW in ff it doesnt recognize the menu div as being inside the body and so the body area shrinks and grows with content div ONLY. Where as, in IE, it grows with both of them.


    also, this is the source code concerning how it's being served:
    meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"

    Is this wrong?
  12.  permalink
    Oh, sorry, I didn't see the new question. >_>

    And your content-type declaration means nothing when served in the document itself in this case. You need to use some sort of Server-Side headers (like PHP).

    A division won't fill up the whole space because you haven't set the height of it. You need to tell it how high to make it.
  13.  permalink
    I want the body to grow to fit with the menu div as well as the content div

    If I set the body to a set height, it again, works in IE... but in FF it restricts the body to the said amount... should I use min-height for FF? But them, if I use that, it will still see the height property and use that...
  14.  permalink
    Wait, what are you trying to accomplish?

    Oh and there's not point to using XHTML 1.1 since you're not even declaring XML (or have the right headers but you know that).
  15.  permalink
    how can i apply a css rule only to IE is what I need to know now, :). I usually do declare xml, I haven't finished working out the entire thing yet...
    •  
      CommentAuthornifkin
    • CommentTimeFeb 16th 2006 edited
     permalink
    If I set the body to a set height, it again, works in IE... but in FF it restricts the body to the said amount... should I use min-height for FF? But them, if I use that, it will still see the height property and use that...

    html, body {
            height:auto !important; /* ff and standards compliant browsers use this */
            height:100%; /* ie overrides the !important rule with whatever comes last */
            min-height:100%;
    }


    how can i apply a css rule only to IE is what I need to know now

    * html whatever selectors you want here {
            /* only affects IE, won't affect IE7 when it's released. */
    }
  17.  permalink
    Thank you kindly. That worked out, though it's sad that I have to do that. I wish in firefox it would display the menu bar as being inside the body and grow or shrink in relation ot the bar as well...
  18.  permalink
    <!--[if lt IE 7]>
    <style type="text/css">
    /* IE less than 7 stuff in here */
    </style>
    <![endif]-->

    You put that directly in your HTML in the <head> section.
  19.  permalink
    What does this correct?
    •  
      CommentAuthortsk
    • CommentTimeFeb 16th 2006
     permalink
    it allows you to fix up your design under IE 7. Whatever you put in that statement will be ignored by any other browser than IE7.

1 to 20 of 20

  1.  
Add your comments
    Username Password
  • Format comments as (Help)
 
Back to Discussions Top of Page