Forums

Give help. Get help.

  • # May 15, 2008 at 6:35 pm

    Hi everybody,

    As I already told last weeks, I am working on a revision of my website and I try to build it up by using em’s so I can make an elastic design of it. Here on Mac OSX with Firefox and Safari everything looks fine, but when I tried it in Internet Explorer with using IE Netrenderer, it doesn’t look that good.

    I am still trying and learning a lot of using em’s and I am sure it’s not perfect yet, but I wonder what you all think of it and maybe you have a solution for the fact that it doesn’t look good in IE?

    Some points I’ve been working on:
    – sticky footer: the footer sticks to the bottom of the page
    – holy grail: the navigation and sidebar are floated to the left and right side of the page and the content is centered in the middle of them.

    The link to the temporary page (this page will be removed again in the future): http://www.edmin2.nl/temp/EdMin2_revised/

    What is your opinion about the code? What is good, what could be done better?

    # May 16, 2008 at 7:10 am
    "chriscoyier" wrote:
    One of the problems with elastic em based sites is that they can grow extremely wide very quickly, which causes users to do a lot of horizontal scrolling which can be nasty.

    Not just nasty, but not readable at all. I’ve already put it up for my personal site upgrade. Both max/min-width so it’ll have a more natural flow, and be readable for users with high resolutions (1600+). A rule of thumb is to have min-width to 780px (which means you’re covering all down to 800×600 resolutions).

    About the EdMin 2.0-page: It’s very good. You’re getting the content up high in the markup, which is nice both for search engines and for screen-readers/text-browsers. It’s also good that you’ve used em-sizing on fonts, making it easy to resize. Smallish note: I thought you could click on "Menu"-text, since it was underlined.

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

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag