Member Avatar for freenetresearch

I am new to CSS. i am currently experimenting with CSS layout and try to adhere to standards as much as i can. i made a webpage using css layout but when i view it in IE it is totally different than i expected. it works fine in flock/firefox. please advise and tel me where i am making mistake. webpage : thanx

  • 3 Contributors
  • 3 Replies
  • 101 Views
  • 4 Days Discussion Span
  • Latest Post Latest Post by Member #114696

Dani AI

Generated

Broad summary: IE7 is mostly standards-aware but still has a few rendering quirks that can break a CSS-based layout that looks fine in Firefox. Since fixed the URL (it looks like a blog-hosted template), first assume there may be extra wrapper HTML or inline styles from the platform. Confirm the actual generated HTML/CSS before changing your stylesheet.

Actionable checklist (quick fixes that solve most IE7 layout problems)

  • Ensure a standards DOCTYPE is present so IE does not fall into quirks mode (for example use <!DOCTYPE html>).
  • If floated blocks show an extra margin on the floated side, add display:inline; to the floated element to stop the double-margin bug.
  • If an element behaves like it ignores width/height or its children collapse, trigger IE’s layout on that element (commonly zoom:1; in an IE-only stylesheet). Note zoom is nonstandard, so confine it to IE rules.
  • Make sure parent containers contain floats: either add a clearfix or use overflow:auto; (and pair with an IE layout trigger if needed).
  • Avoid fragile global hacks. Use an IE-specific stylesheet via conditional comments instead of sprinkling nonstandard properties across your main CSS.

Example IE-only wrapper (put in your page head to scope fixes to IE7):

<!--[if IE 7]>
<style>
/* IE7-specific adjustments here */
</style>
<![endif]-->

Debug workflow

  • Reduce the page to a minimal test case: strip everything but the container and the problematic elements. That isolates the cause.
  • Use the browser tools (Firefox/Firebug or the IE developer toolbar) to inspect computed styles and see which rule is winning.
  • Validate HTML/CSS and check for stray tags, missing closing tags, or inline styles injected by the blog template.

Notes tied to earlier replies

  • : confirming the correct URL is essential so helpers can inspect the same output.
  • : browser-specific rules are often the right path, but prefer targeted IE styles via conditional comments rather than global hacks.

Recommended Answers

All 3 Replies

Member Avatar for roryt

I don't think that is your page and if it is in this forum it is SPAM because it is a page full of ads! If you do not post the correct link to your site we can't help you.

Member Avatar for freenetresearch

Sorry it was typo. it is

Member Avatar for Member #114696

Well to rectify this problem you wil have too take a look at your code, and view it simultaneously both on IE and FF. Also properties starting with "*" are just read by IE.

You must also see the reference at W3Schools, it shows which runs perfectly on which browser. Also few editors also guides through this.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.