background-color wraps in IE

Thread Solved

Join Date: Sep 2007
Posts: 271
Reputation: fatihpiristine has a little shameless behaviour in the past 
Solved Threads: 16
fatihpiristine's Avatar
fatihpiristine fatihpiristine is offline Offline
Posting Whiz in Training

background-color wraps in IE

 
0
  #1
Oct 10th, 2009
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.

  1. body
  2. {
  3. background-color: #363636;
  4. color: #FFFFFF;
  5. font-family: tahoma,sans-serif;
  6. font-size: 70%;
  7. height: 100%;
  8. line-height: 1.2em;
  9. margin: 0;
  10. padding: 0;
  11. text-align: left;
  12. width: 100%;
  13. }


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

  1. html
  2. {
  3. /* Fix for background issue in IE */
  4. background-color: #363636;
  5. height: 100%;
  6. width: 100%;
  7. }
  8.  
  9. body
  10. {
  11. background-color: #363636;
  12. color: #FFFFFF;
  13. font-family: tahoma,sans-serif;
  14. font-size: 70%;
  15. height: 100%;
  16. line-height: 1.2em;
  17. margin: 0;
  18. padding: 0;
  19. text-align: left;
  20. width: 100%;
  21. }

anyone knows why it is happening ?
Attached Files
File Type: zip test.zip (546 Bytes, 4 views)
Do a favour, leave me alone
Reply With Quote Quick reply to this message  
Join Date: Jan 2009
Posts: 91
Reputation: Zero13 is an unknown quantity at this point 
Solved Threads: 13
Zero13 Zero13 is offline Offline
Junior Poster in Training
 
0
  #2
Oct 11th, 2009
Check your url. You import core.css from where. Are the HTML and css same root?
Reply With Quote Quick reply to this message  
Join Date: Sep 2007
Posts: 271
Reputation: fatihpiristine has a little shameless behaviour in the past 
Solved Threads: 16
fatihpiristine's Avatar
fatihpiristine fatihpiristine is offline Offline
Posting Whiz in Training
 
0
  #3
Oct 11th, 2009
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.
Do a favour, leave me alone
Reply With Quote Quick reply to this message  
Join Date: Jun 2008
Posts: 348
Reputation: Troy III will become famous soon enough Troy III will become famous soon enough 
Solved Threads: 42
Troy III's Avatar
Troy III Troy III is offline Offline
Posting Whiz
 
0
  #4
Oct 11th, 2009
-what doctype are you using?
Reply With Quote Quick reply to this message  
Join Date: Sep 2007
Posts: 271
Reputation: fatihpiristine has a little shameless behaviour in the past 
Solved Threads: 16
fatihpiristine's Avatar
fatihpiristine fatihpiristine is offline Offline
Posting Whiz in Training
 
0
  #5
Oct 11th, 2009
XHTML 1.0 strict

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us" dir="ltr">

html is valid. tried with transnational as well
Do a favour, leave me alone
Reply With Quote Quick reply to this message  
Join Date: Jun 2008
Posts: 348
Reputation: Troy III will become famous soon enough Troy III will become famous soon enough 
Solved Threads: 42
Troy III's Avatar
Troy III Troy III is offline Offline
Posting Whiz
 
0
  #6
Oct 11th, 2009
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!]
Reply With Quote Quick reply to this message  
Join Date: May 2009
Posts: 21
Reputation: leahmarie is an unknown quantity at this point 
Solved Threads: 2
leahmarie leahmarie is offline Offline
Newbie Poster
 
0
  #7
Oct 12th, 2009
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.
Reply With Quote Quick reply to this message  
Join Date: Sep 2007
Posts: 271
Reputation: fatihpiristine has a little shameless behaviour in the past 
Solved Threads: 16
fatihpiristine's Avatar
fatihpiristine fatihpiristine is offline Offline
Posting Whiz in Training
 
0
  #8
Oct 12th, 2009
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.
Do a favour, leave me alone
Reply With Quote Quick reply to this message  
Join Date: Sep 2007
Posts: 271
Reputation: fatihpiristine has a little shameless behaviour in the past 
Solved Threads: 16
fatihpiristine's Avatar
fatihpiristine fatihpiristine is offline Offline
Posting Whiz in Training
 
0
  #9
Oct 12th, 2009
Originally Posted by Troy III View Post
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
Do a favour, leave me alone
Reply With Quote Quick reply to this message  
Join Date: Jun 2008
Posts: 348
Reputation: Troy III will become famous soon enough Troy III will become famous soon enough 
Solved Threads: 42
Troy III's Avatar
Troy III Troy III is offline Offline
Posting Whiz
 
0
  #10
Oct 12th, 2009
Originally Posted by fatihpiristine View Post
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 and CSS Syntax (Toggle Plain Text)
  1. html, body
  2. {
  3. background-color: #363636;
  4. color: #FFFFFF;
  5. margin: 0;
  6. padding: 0;
  7. width: 100%;
  8. height: 100%;
  9. }
  10. body
  11. {
  12. font-size: 70%;
  13. font-family: tahoma,sans-serif;
  14. line-height: 1.2em;
  15. text-align: left;
  16. }
Last edited by Troy III; Oct 12th, 2009 at 3:15 pm.
Reply With Quote Quick reply to this message  
Reply

Tags
css

This thread has been marked solved.
Perhaps start a new thread instead?
Message:


Thread Tools Search this Thread



About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC