Problem with Background Html/Css

Asked

Viewed 478 times

9

I created a id in css with a background. When I put the div in html the background looks beautiful, but when I put a <form>, the part he occupies turns white.

Como fica:

Note: when I put the text in bold also the same.

How can I fix this?

Here’s an example in Jsfiddle and my code is like this:

CSS

#backgroundSlider{
   width: 100%;
   background: #000;
   height: 300px;
}

HTML

<!DOCTYPE html>
<meta charset="UTF-8">
<html>
    <head><title>Página de Contato</title>
        <link rel="stylesheet" href="styles.css">
    </head>
<body>
<div id="site">
    <div id="barramenu">menu menu menu menu</div>
    <div id="backgroundSlider">
    slider
        <form>
            Nome: <input type="text" name="nome"/><br>
            Email: <input type="email" name="email"/><br>
            Mensagem: <input type="text" name="menssagem"/><br>
            <input class="button" type="submit" value="Enviar"/>
        </form>
    </div>
    <div id="backgroundInfo">
    Background info
    </div>
    <div id="rodape">rodape</div>

</div>
</body>
</html>
html css
  • 2

    Felipe, welcome to Stackoverflow! I think the vote was a bit harsh because there was a lot of information missing. Now the question looks much better! To add HTML just use spacing (4 spaces) or use \``, por exemplo assim: `var foo;`, teste isso no seu <form>` which is hidden in the question. By the way, can you create a jsFiddle with this problem? So you will get a certainly quicker answer.

  • Do you have any css rules for the form? it may be that it has the background-color set in white, so when you put the form on the page its background turns white. Can I mount a Jsfiddle? http://jsfiddle.net/

  • 1

    Edited, and thanks for the tips and personal patience.

  • Jsfiddle: http://jsfiddle.net/7r7b4/ The form is not formatted, by default..

1 answer

12


Seeing your fiddle, the problem is in CSS itself. You have a rule

*{
    background-color:   #FFF;
    margin: 0px;
    padding: 0px;
}

That’s the problem, because you are setting for all elements (operator *) a white background color, and that’s why when you add the form the background of it turns white.

  • 2

    If by Default the background color is already white.. why create such a rule?

  • I was probably testing something, so I must have put the white background. Thank you so much for your help!

  • No problems! See you later, good development.

  • 3

    @okevinlira White is not default background color, where did you get this? This is a big mistake, in my browser for example become horrible the sites that start from this premise. Background color depends on the browser and OS color scheme.

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.