发表新帖
发表新帖

Issue with background color and Google Chrome

后端 未结
关注
22 1049
一向
一向 2020-12-08 02:06

Sometimes I get a broken background in Chrome. I do not get this error with any other browser.

This is the simple CSS line responsible for the background color of b

相关标签:
22条回答
  • 你的背包
    2020-12-08 02:33 
    body, html { 
   width: 100%;
   height: 100%;
}

    Worked for me :)

    0 讨论(0)
  • 清歌不尽
    2020-12-08 02:36

    I would try what Logan and 1mdm suggested, tho tweak the CSS, but I would really wait for a new Chrome version to come out with fixed bugs, before growing white hair.

    IMHO the current Chrome version is still alpha version and was released so that it can spread while it is in development. I personally had issues with table widths, my code worked fine in EVERY browser but could not make it work in Chrome.

    0 讨论(0)
  • 你的背包
    2020-12-08 02:37

    Here is how I ended up solving the problem:

    This was the actual issue, clearly the body tag defined in CSS was not picked up.

    Body tag not working in Chrome/Safari

    My environment: Chrome Browser/Safari,

    First time when it does not work, So according to the thread recommendation here I ended up adding the css file with the html entry

    Sample CSS file: mystyle.css

    <style type="”text/css”">
html {
 background-color:#000000;
 background-repeat:repeat-x;
 }

body {
 background-color: #DCDBD9;
color: #2C2C2C;
font: normal 100% Cambria, Georgia, serif;
}
</style>

    Sample html file:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html>
<head>
  <meta name="generator" content="HTML Tidy for Mac OS X (vers 31 October 2006 - Apple Inc. build 15.6), see www.w3.org">

  <title>Test Html File</title>
  <link rel="stylesheet" href="mystyle.css" type="text/css">
</head>

<body>
  <h1>Achieve sentence with Skynet! READ MORE</a></h1>
</body>
</html>

    After the first loading it will work in Chrome and then go back to CSS file comment the html entry, so your modified CSS will be 

    <style type="”text/css”">
// html {
//    background-color:#000000;
//    background-image:url('bg.png');
//    background-repeat:repeat-x;
// }

body {
    background-color: #DCDBD9;
    color: #2C2C2C;
    font: normal 100% Cambria, Georgia, serif;
    }

  </style>

    Clearly seems to be bug in webkit, Saw the same behavior in Safari as well. Thanks for sharing the html information, have been hunting around forever of why the body tag was not working.

    The final output is something like this:

    After fixing the html tag

    0 讨论(0)
  • 攒了一身酷
    2020-12-08 02:39

    Adam's chromeFix solution with Paul Alexander's pure-CSS modification solved the problem in Chrome, but not in Safari. A couple additional tweaks solved the problem in Safari, too: width: 100% and z-index:-1 (or some other appropriate negative value that puts this element behind all the other elements on the page).

    The CSS:

    body:after {display:block; position:absolute; width:100%; height:100%; top:0px; left:0px; z-index:-1; content: "";}
    0 讨论(0)
  • 北恋
    2020-12-08 02:39

    It must be a WebKit issue as it is in both Safari 4 and Chrome.

    0 讨论(0)
  • 抹茶落季
    2020-12-08 02:41

    I am not sure 100%, but try to replace selector with "html, body":

    html, body 
{
   background: black;
   color: white;
   font-family: Chaparral Pro, lucida grande, verdana, sans-serif;
}
    0 讨论(0)
 看不清?
提交回复
热议问题