I have a question regarding the position of the logo of a website I'm creating.
I'm now learning HTML and CSS, I'm having some doubts, one of them would be the positioning of the logo.
This following image would be in DW Software, it is cut off at the end but it is in the position you would like it to be.
NowwhenIsimulateinSoftwarewithF12itlookslikethis:
CSSandHTMLcode:
@charset "utf-8";
/* CSS Document */
body {
font-family:Calibri;
font-size:30px;
line-height:36px;
color:rgb(255,255,255);
text-align:left;
}
#topo {
background:url(../imagens/topo.png);
width:1024px;
height:190px;
border-bottom:none;
margin:auto;
}
#logo {
float : right;
background: url(../imagens/logoc.png);
width: 528px;
height: 133px;
position: absolute;
top: 37px;
left: 35px;
}
#fundoinicial {
width:1024px;
height:1080px;
margin:10px auto 20px auto;
background-image:url(../imagens/fundoof.png);
}
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/reset.css" rel="stylesheet" type="text/css" />
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-image: url(../PLANILHAS%20CAIO/projeto/imagens/fundo.jpg);
}
</style>
</head>
<body>
<div id ="logo"></div><!--div logo-->
<div id ="topo"></div><!--div do topo-->
<div id ="fundoinicial"></div><!--div fundo-->
<div id="menu_conteiner"> <!--div menu-->
<div id="menu">
<ul>
<li><a href="#">Pagina Inicial</a></li>
<li><a href="#">Areas de cobertura</a></li>
<li><a href="#">Serviços</a></li>
<li><a href="#">Quem somos</a></li>
<li><a href="#">Fale conosco</a></li>
</ul>
</div>
</body>
</html>