Member Avatar for litias

Hi there...my codes are working fine for chrome and firefox but IE8 is giving me a hard time can anyone please help me out ?

Here are my codes

  • 2 Contributors
  • 4 Replies
  • 67 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by makman99

Dani AI

Generated

Short summary tied to the thread: reported the page background looks correct in Chrome/Firefox but in IE8 the image is misaligned and only appears after maximizing/minimizing. 's hint about background-position helps alignment, but IE8 can also need a layout/repaint trigger or the background must be attached to the right element.

Practical steps that fix both alignment and the "appears after resize" redraw problem:

  • Center the page container itself (not just the image) by giving it fixed width and left/right margins set to auto. This is the cross-browser way to center a block-level layout; see the CSS margin reference for details (margin).
  • If the image should be centered relative to the viewport, put the background on the body/html element rather than the inner container and use a centered, non-repeating background (background).
  • If IE8 only shows the image after a resize, force a layout/repaint for that element in IE by adding a small, harmless layout trigger such as position: relative; plus the non-standard zoom: 1; (this is a known IE technique) — more on the zoom property here: zoom.

Also confirm the page is in standards mode (valid DOCTYPE) and not running in Compatibility View / an older document mode. See the Doctype glossary for why that matters: Doctype.

Example debugging steps: temporarily outline the container to verify its bounds, test moving the background to body, add zoom:1/position:relative to force a repaint, and check the F12 Document Mode in IE8. These usually pinpoint whether the issue is alignment vs. IE redraw.

Recommended Answers

All 4 Replies

Member Avatar for makman99

Nobody wants to download stuff... try to narrow down where the issue is, and post the html and css sections/files please.

Member Avatar for litias

My Css

#main{
    background-image:url(base.jpg);
    width:650px;
    text-align:left;
}

the main thing is that my background-image is at the center of the webpage in firefox but not in IE8

Edited by Nick Evan because: Fixed formatting
Member Avatar for litias

I'm having problems with my background picture now !!! In IE8 i got to maximize and minimize my IE8 to see the background picture !! how to fix this ?

Member Avatar for makman99 
background-position: top center;
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.