Good evening, I'm having a problem, I'm learning to make a website, I'm having some doubts regarding the grids system I looked for. I did not understand very well, so I came here in the forum, this is happening when I zoom on the page. of the place
I'm on the menu tab but it happens on all pages
just top the menu and the bottom, someone can help me or point me something that I can improve or study.
@charset "utf-8";
/* CSS Document */
#topo {
background:url(../imagens/topo2etrelas2.png);
border-left:1px solid #000;
border-right:1px solid #000;
position:inherit;
width:1024px;
height:190px;
margin:auto;
}
#fundoinicial {
background: #FFF;
width: 1024px;
height: 500px;
margin: auto;
border-right: 1px solid #000;
border-left: 1px solid #000;
}
h3 {
font-family:"Arial Black", Gadget, sans-serif;
font-size:25px;
position:absolute;
top:271px;
left:618px;
text-shadow: #60365E 0px 0px 5px;
}
p1 {
font-family:Arial, Helvetica, sans-serif;
font-size:15px;
position:absolute;
width:1000px;
top:350px;
left:179px;
text-align:center;
}
hr {
border: 0;
height: 1px;
background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
width:300px;
position:absolute;
top: 300px;
left: 512px;
margin:auto;
}
#baixo {
border: 0;
height: 1px;
background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
width:1050px;
position:absolute;
top: 250px;
left: -25px;
margin:auto;
}
#menufundo {
background:#60365e;
border:1px solid #000;
position:relative;
width:1024px;
height:28px;
margin:auto;
}
#ul li a{
font-family:"Comic Sans MS", cursive;
font-style:normal;
list-style-type:none;
display: inline;
font-size:19px;
line-height:0px;
padding:10px;
margin:4px 0 0 52px;
color:#FFF;
text-decoration:none;
float:left;
}
#ul li a:hover{
text-shadow:0px 0px 0px black,
0px 0px 0px black,
0px 0px 0px black,
0px 0px 0px black;
font-size:19px;
color:black;
}
.rodape {
background: url(../imagens/rodape.png);
margin: auto;
position: absolute;
width: 1056px;
height: 99px;
left: 132px;
top: 704px;
}
h1 a{
font-family: "Comic Sans MS", cursive;
font-size: 19px;
color: #FFF;
text-decoration: none;
text-shadow: 1px 1px black;
position: absolute;
left: 176px;
top: 714px;
}
p a{
font-family: "Comic Sans MS", cursive;
font-size: 15px;
color: #FFF;
text-decoration: none;
text-shadow: 1px 1px black;
position: absolute;
left: 175px;
top: 743px;
}
.facebook{
width: 32px;
right: 32px;
position: absolute;
top: 25px;
left: 515px;
opacity: 0.5;
filter: alpha(opacity=50);
}
.facebook:hover {
opacity: 1.0;
filter: alpha(opacity=100); /* For IE8 and earlier */
}
.trabalhe {
font-family: "Comic Sans MS", cursive;
font-size: 19px;
color: #FFF;
text-decoration: none;
text-shadow: 1px 1px black;
position: absolute;
left: 986px;
top: 729px;
width: 159px;
}
.email {
font-family: "Comic Sans MS", cursive;
font-size: 15px;
color: #FFF;
text-decoration: none;
text-shadow: 1px 1px black;
position: absolute;
margin-top: 20px;
left: 987px;
top: 736px;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Alfatec</title>
<link rel="shortcut icon" href="imagens/ico.png" type="imagem/x-png" />
<link href="css/resetquemsomos.css" rel="stylesheet" type="text/css" />
<link href="css/estiloquemsomos.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery/jquery-migrate-3.0.0.min.js" ></script>
<style type="text/css">
body {
background-image: url(imagens/projeto/imagens/fundo.jpg);
}
</style>
</head>
<body>
<div id="topo"></div><!--div final topo-->
<div id="menufundo">
<nav id="ul">
<ul>
<li><a href="index.html" title="Página Inicial">Página Inicial</a></li>
<li><a href="quem_somos.html" title="Quem Somos">Quem Somos</a></li>
<li><a href="cobertura.html" title="Áreas de Cobertura">Áreas de Cobertura</a></li>
<li><a href="servicos.html" title="Serviços">Serviços</a></li>
<li><a href="fale_conosco.html" title="Fale Conosco">Fale Conosco</a></li>
</ul>
</nav>
</div>
<div id ="fundoinicial">
<h3>Alfatec</h3>
<hr />
<p1> A empresa (nome da empresa) foi fundada no ano de (ano da fundação, por exemplo, 1998) na cidade (nome da cidade) pelo Senhor (nome do fundador) e sua principal missão é oferecer soluções para empresas de e-commerce e Internet. Atualmente contamos com XX funcionários e nossos principais clientes são (coloque aqui o que sua empresa vende ou oferece).
2- Fundada em (ano da fundação, por exemplo, 1998) pelo Senhor (nome do fundador), a principal missão da empresa (nome da empresa) é oferecer (coloque aqui o que sua empresa vende ou oferece). Nossos principais clientes são (nome dos clientes atuais) e atualmente contamos com XX funcionários.
3- A missão da empresa (nome da empresa) é fornecer soluções para empresas de e-commerce e Internet. Nossos principais clientes são (coloque aqui o que sua empresa vende ou oferece). Fundada em (ano da fundação, por exemplo, 1998) pelo Senhor (nome do fundador), na cidade (nome da cidade), atualmente contamos com (quantidade de pessoas que trabalham na empresa) funcionários.
A empresa (nome da empresa) foi fundada no ano de (ano da fundação, por exemplo, 1998) na cidade (nome da cidade) pelo Senhor (nome do fundador) e sua principal missão é oferecer soluções para empresas de e-commerce e Internet. Atualmente contamos com XX funcionários e nossos principais clientes são (coloque aqui o que sua empresa vende ou oferece).
A empresa (nome da empresa) foi fundada no ano de (ano da fundação, por exemplo, 1998) na cidade (nome da cidade) pelo Senhor (nome do fundador) e sua principal missão é oferecer soluções para empresas de e-commerce e Internet. Atualmente contamos com XX funcionários e nossos principais clientes são (coloque aqui o que sua empresa vende ou oferece).
2- Fundada em (ano da fundação, por exemplo, 1998) pelo Senhor (nome do fundador), a principal missão da empresa (nome da empresa) é oferecer (coloque aqui o que sua empresa vende ou oferece). Nossos principais clientes são (nome dos clientes atuais) e atualmente contamos com XX funcionários. </P>
<div id="baixo"/>
</div>
</div>
<div class="rodape">
<a href="https://www.facebook.com/Alfatec-Autorizada-Electrolux-1737242946511224/" title="Facebook" target="_blank">
<img id= "facebook" src="imagens/facebook-logo (2).png" alt="FaceBook" width="24" class="facebook" >
</a>
</div>