Ir para conteúdo
  • 0

[HTML] Dúvida...

Hemptt

Perguntado por Hemptt,

 Compartilhar

Pergunta

Hemptt

Hemptt

Postado
Postado (editado)

Hello friends!


Eu comecei os meus estudos com hmtl, e css 2 dias atrás, e por esse motivo não tenho tanto conhecimento no assunto,


portanto, não sei resolver alguns erros/problemas, que dão nos códigos básicos...


 


Eu estou com o seguinte problema, tem um espaçamento entre a imagem e um background, e eu não consigo remover esse espaço nem ferrando, quem puder me ajudar, eu agradeço...


 


Print's:


 


http://prntscr.com/hr8j4v


 


 


html:


 




<!DOCTYPE html>

<html>

<head>

<title>Inicio - UnderMC!</title>

<link rel="icon" href="img/icone.png" >

<link rel="stylesheet" href="css/style.css" >

<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 

<meta charset="utf-8">

<style>

body{

background-color: #DCDCDC;

}

    </style>

</head>

 

<!-- Construção da página -->

<body>

<header class="logo">

    <h1 class="icone">

        <a href="index.html" title="UnderMC">Inicio - UnderMC!</a>

        </h1>

        <ul class="menu">

         <li><a href="#">SOBRE</a></li>

         <li><a href="discord.html">DISCORD</a></li>

         <li><a href="loja.html">LOJA</a></li>

         <li><a href="#">INICIO</a></li>

        </ul>

</header>

<center><img style="width: 100%;" draggable="false" src="img/mineimg.png"/></center>

<div class="ip">

<p><strong>

JOGUE AGORA! 1.8x - IP: UNDERMC.COM.BR</strong>

</p>

</div><br><br>

<p><center>In sem justo, commodo ut, suscipit at, pharetra vitae, orci. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam id dolor. Class aptent taciti sociosqu ad litora</center></p>

            <nav class="discord_links">

            <center><a href="https://discordapp.com/" target="_blank">Clique aqui para baixar!</a></center><br>

            <center><a href="#" target="_blank">Clique aqui para entrar em nosso servidor no <i>discord!</i></a></center>

</body>

</html>

 


 


CSS


 




/* RESET */

*{margin: 0; border: 0; padding: 0; font-size: 100%; font-family: 'Open Sans', sans-serif; font-weight: normal; box-sizing:

border-box;}

img{max-width: 100%;}

ul{list-style: none;}

a{text-decoration: none;}

h2{font-size: 1.5em; color:#333;}

p{font-size: 1em; color:#777;}

/* menu*/

.logo {width: 100%; height: 75px; float: left; padding: 10px 80px 10px; background-color:#0cae98;}

.icone a {width: 150px; height: 150px; float: left; background: url(../img/icone2.png) no-repeat; font-size: 0;}

/* links*/

.ip {width: 100%; float: left; background-color: #13c7ae; padding: 0px 150px; margin-top: 0;box-shadow: 2px 2px 2px #828282;}

.ip p {color: #fff;}

.menu li{width: 70px;float: right; padding: 40px 15px; margin-right: 50px;}

.menu a{color: #fff; margin-right: 30px;}

.menu li a:hover {color: #777;}

 

/*Discord info*/

.principal {padding: 20px 8%;}

.discord_info {width: 100%; padding: 150px 20px 20px 0px; color: #1C1C1C;}

.discord_links a {color: #1C1C1C;}

 


 


Se vocês, puderem ajudar, eu agradeço!


Editado por Haade
Link para o comentário
Compartilhar em outros sites

12 respostass a esta questão

Posts Recomendados

Dokitos

Dokitos

Postado
Postado

Troque o HTML por este:
 

<!DOCTYPE html>
<html>
<head>
<title>Inicio - UnderMC!</title>
<link rel="icon" href="img/icone.png" >
<link rel="stylesheet" href="css/style.css" >
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
<meta charset="utf-8">
<style>
body{
background-color: #DCDCDC;
}
    </style>
</head>
 
<!-- Construção da página -->
<body>
<header class="logo">
    <h1 class="icone">
        <a href="index.html" title="UnderMC">Inicio - UnderMC!</a>
        </h1>
        <ul class="menu">
         <li><a href="#">SOBRE</a></li>
         <li><a href="discord.html">DISCORD</a></li>
         <li><a href="loja.html">LOJA</a></li>
         <li><a href="#">INICIO</a></li>
        </ul>
</header>
<center><div id="background">
<img style="width: 100%;" draggable="false" src="img/mineimg.png"/>
</div>
</center>
<div class="ip">
<p><strong>
JOGUE AGORA! 1.8x - IP: UNDERMC.COM.BR</strong>
</p>
</div><br><br>
<p><center>In sem justo, commodo ut, suscipit at, pharetra vitae, orci. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam id dolor. Class aptent taciti sociosqu ad litora</center></p>
            <nav class="discord_links">
            <center><a href="https://discordapp.com/" target="_blank">Clique aqui para baixar!</a></center><br>
            <center><a href="#" target="_blank">Clique aqui para entrar em nosso servidor no <i>discord!</i></a></center>
</body>
</html>

Adicione ao seu css:
 

#background {
    margin-bottom: -5px;
}
1
Link para o comentário
Compartilhar em outros sites
TequilAxBr

TequilAxBr

Postado
Postado

Tente trocar essa linha no CSS:

.ip {width: 100%; float: left; background-color: #13c7ae; padding: 0px 150px; margin-top: 0;box-shadow: 2px 2px 2px #828282;}

Por essa:

.ip {width: 100%; float: left; background-color: #13c7ae; margin-top: 0 !important; box-shadow: 2px 2px 2px #828282;}
Link para o comentário
Compartilhar em outros sites
Hemptt

Hemptt

Postado
  • Autor
Postado

 

Tente trocar essa linha no CSS:

.ip {width: 100%; float: left; background-color: #13c7ae; padding: 0px 150px; margin-top: 0;box-shadow: 2px 2px 2px #828282;}

Por essa:

.ip {width: 100%; float: left; background-color: #13c7ae; margin-top: 0 !important; box-shadow: 2px 2px 2px #828282;}

Não funcionou ._.

Link para o comentário
Compartilhar em outros sites
Hemptt

Hemptt

Postado
  • Autor
Postado

 

Troque o HTML por este:

 

<!DOCTYPE html>
<html>
<head>
<title>Inicio - UnderMC!</title>
<link rel="icon" href="img/icone.png" >
<link rel="stylesheet" href="css/style.css" >
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"> 
<meta charset="utf-8">
<style>
body{
background-color: #DCDCDC;
}
    </style>
</head>
 
<!-- Construção da página -->
<body>
<header class="logo">
    <h1 class="icone">
        <a href="index.html" title="UnderMC">Inicio - UnderMC!</a>
        </h1>
        <ul class="menu">
         <li><a href="#">SOBRE</a></li>
         <li><a href="discord.html">DISCORD</a></li>
         <li><a href="loja.html">LOJA</a></li>
         <li><a href="#">INICIO</a></li>
        </ul>
</header>
<center><div id="background">
<img style="width: 100%;" draggable="false" src="img/mineimg.png"/>
</div>
</center>
<div class="ip">
<p><strong>
JOGUE AGORA! 1.8x - IP: UNDERMC.COM.BR</strong>
</p>
</div><br><br>
<p><center>In sem justo, commodo ut, suscipit at, pharetra vitae, orci. Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam id dolor. Class aptent taciti sociosqu ad litora</center></p>
            <nav class="discord_links">
            <center><a href="https://discordapp.com/" target="_blank">Clique aqui para baixar!</a></center><br>
            <center><a href="#" target="_blank">Clique aqui para entrar em nosso servidor no <i>discord!</i></a></center>
</body>
</html>

Adicione ao seu css:

 

#background {
    margin-bottom: -5px;
}

Resolvi, com o margin-bottom= -5px; vlw

Link para o comentário
Compartilhar em outros sites
Visitante
Este tópico está impedido de receber novos posts.
 Compartilhar
Ir para lista de perguntas

  • Quem está navegando   0 membros estão online

    • Nenhum usuário registrado visualizando esta página.
×
×
  • Criar Novo...