Member Avatar for fatihpiristine

hey guys..

i have a problem on IE7. following css causing this. the problem is that wrapper div when its height is less than viewable area of the browser, browser doesn't apply background color. only applied to main div.

body
{
    background-color: #363636;
    color: #FFFFFF;
    font-family: tahoma,sans-serif;
    font-size: 70%;
    height: 100%;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 100%;
}

i fixed this giving same background color html but same code is working on another website www.biranket.com

html
{
    /* Fix for background issue in IE */
    background-color: #363636;
    height: 100%;
    width: 100%;
}

body
{
    background-color: #363636;
    color: #FFFFFF;
    font-family: tahoma,sans-serif;
    font-size: 70%;
    height: 100%;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 100%;
}

anyone knows why it is happening ?

  • 4 Contributors
  • 10 Replies
  • 160 Views
  • 2 Days Discussion Span
  • Latest Post Latest Post by fatihpiristine
Member Avatar for ko ko

Check your url. You import core.css from where. Are the HTML and css same root?

Member Avatar for fatihpiristine

yes they are there.. if you realized the html has no white space at all which is generated by c# code. same code used on www.biranket.com but i don't have this problem there.

Member Avatar for Troy III

-what doctype are you using?

Member Avatar for Troy III

Try this:

html, body
{
    background-color: #363636;
    color: #FFFFFF;
    font-family: tahoma,sans-serif;
    font-size: 70%;
    height: 100%;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 100%;
}

[for strict mode!]

Member Avatar for leahmarie

In my opinion you could use a separate file of css dedicated to IE, Most designers do this things because of IE's bringing the problem all the time when it comes to appearance.

Member Avatar for fatihpiristine

it is not need to be something specific to IE coz i don't see any reason to do that. It is kind of rendering issue no ? coz it doesn't happen in IE6. only IE7. haven't tried with IE8.

Member Avatar for fatihpiristine

Try this:

html, body
{
    background-color: #363636;
    color: #FFFFFF;
    font-family: tahoma,sans-serif;
    font-size: 70%;
    height: 100%;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    text-align: left;
    width: 100%;
}

[for strict mode!]

that works if you see my first post above. i have did the same.

but there you will get issue with font-size which will 70% for body from 70% given to HTML

Member Avatar for Troy III

that works if you see my first post above. i have did the same.

but there you will get issue with font-size which will 70% for body from 70% given to HTML

That's why CSS is invented for.
You group select and you divide particulars when needed.
So we will split that body of statements in two groups so we drop properties not needed for html to assign only to element that will need them.

html, body
{
    background-color: #363636;
    color: #FFFFFF;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}
body
{
    font-size: 70%;
    font-family: tahoma,sans-serif;
    line-height: 1.2em;
    text-align: left;
}
Edited by Troy III because: n/a
Member Avatar for fatihpiristine

yea right... anyways thanks for the suggestions.

another tricky solution i found: setting the overflow to visible for wrapper div. now it is working fine.

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.