I can not change the color of a div, I think I did something wrong that is preventing it (the div I am talking about is the .div_barra_search) [closed]

Question

I can not change the color of a div, I think I did something wrong that is preventing it (the div I am talking about is the .div_barra_search) [closed]

Navigation

#1 by (1 votes)
#2 by (1 votes)

-2

<html>

<head>
<meta charset="utf8">
<title>google</title>

<style>
.div1{
  padding-top: 8px;
  text-align: right;
}

.textos-top{
  text-decoration: none;
  font-family: arial, sans-serif;
  font-size: 13px;
  padding-left: 15px;

  color: black;
  vertical-align: middle;
}
.img_top{
  display: inline-block;

  text-align: right;
  padding-left: 15px;
  vertical-align: middle;
  margin-right: 12px;
}
.fazer_login{
  display: inline-block;

  font-family: arial,sans-serif;
  font-size: 13px;
  font-weight: bold;
  text-decoration: none;
  color: white ;
  text-align: center;


  background-color: #4387fd;   
  border-radius: 2px;
  line-height: 30px;
  padding-left: 13px;
  padding-right: 13px;
  margin-right: 20px;
}

.logo{

  text-align: center;
  vertical-align: middle;
  margin-top: 145px;
}
.barra_de_pesquisa{
  display:inline-block;

  margin-top: 42px;
  width: 25%;

  border: 1px solid #e6e6e6;
  border-right: none;

  line-height : 20px;
  height : 20px ;
  padding : 7.5px
}
.div_barra_pesquisa{
  display: inline-block;

  background-color: black;
  border-left: none;

}


</style>

</head>

<body>
<div class="div1">
  <a href="" class="textos-top"> Gmail </a>
  <a href="" class="textos-top"> Imagens </a>
  <a href=""><img src="botao_google.png" class="img_top"></a>
  <a href="" class="fazer_login" >Fazer login</a>
<center>
  <img src="logo_google.png" class="logo">
  <br>
  <input type="" name="" class="barra_de_pesquisa";>
  <div class="div_barra_pesquisa">

  </div>
  <br>
</center>

</body>

</html>

html css

asked by anonymous 07.03.2018 / 23:38

2 answers

How to convert a VB6 project (.vbp) to VB.NET (.vbproj)? [closed] How to configure text editor for git

score 1 · Answer 1

Color it is getting, however it has no content inside it, so it does not expand, you can set the size by CSS as in the example below:

.div_barra_pesquisa{
  display: inline-block;
  width:100px; //Largura
  height:100px; //altura
  background-color: #000;
  border-left: none;
}

I've put these sample sizes, change them as needed.

score 1 · Answer 2

When you create a div, and it does not contain any elements inside it, the height is zero, so it is not displaying the background black color ...

To display and you can fill this black background, it has 2 modes: put in CSS:

.div_barra_pesquisa{
  height:100px; //altura 
}

or go to the HTML and write anything inside the div, and it will already be shown a black background ..