probleme aliniere header
Moderatori: eyecon, Moderatori
probleme aliniere header
Salut. Am o problema legata de alinierea headerului. Doresc sa il aliniez stanga-sus si nu reusesc.
Problema este ca am vreo 5px margin sus stanga si dreapta...si doresc 0px stanga-sus....
Cod HTML:
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="../css/common.css" />
<link type="text/css" rel="stylesheet" href="../css/detalii.css" />
</head>
<body>
<div class="header">Bine aţi venit</div>
Cod CSS:
.body{
width:1000px;
margin:0 auto;
padding:0;
}
.header{
width:1000px;
height:60px;
background-color:black;
}
Problema este ca am vreo 5px margin sus stanga si dreapta...si doresc 0px stanga-sus....
Cod HTML:
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="../css/common.css" />
<link type="text/css" rel="stylesheet" href="../css/detalii.css" />
</head>
<body>
<div class="header">Bine aţi venit</div>
Cod CSS:
.body{
width:1000px;
margin:0 auto;
padding:0;
}
.header{
width:1000px;
height:60px;
background-color:black;
}
Ultima oară modificat Sâm Ian 12, 2013 11:17 pm de către anshbach, modificat 1 dată în total.
Re: probleme aliniere header
Esti sugur ca e padding spatiul acela? poate e margin ... sau border. AI un link unde putem vedea problema? Nu de alta dar poate fi de la o gramada de chestii spatiul ala.
Re: probleme aliniere header
Nu am un link din pacate. Problema este ca headerul este aliniat ok la alte pagini in care am pe verticala o lista de produse extrasa din baza de date...pe cand in fisierul in care nu mai am lista respectiva nu se mai aliniaza ok....deci lista ajuta si la alinierea headerului...
si nu prea intelegeam logica..
am incercat sa remediez problema printr-un div gol de latimea listei de produse....dar degeaba....
am introdus tagul br de mai multe ori...astfel incat sa apara si scrollu-ul(ca asta era diferenta intre pagini)...si nimic...
SI DA ERA GRESITA EXPRIMAREA...era margin nu padding...scuze...am corectat
si nu prea intelegeam logica..
am incercat sa remediez problema printr-un div gol de latimea listei de produse....dar degeaba....
am introdus tagul br de mai multe ori...astfel incat sa apara si scrollu-ul(ca asta era diferenta intre pagini)...si nimic...
SI DA ERA GRESITA EXPRIMAREA...era margin nu padding...scuze...am corectat
Re: probleme aliniere header
Din ce am vazut la tine ... nu ai specificat un <!DOCTYPE> este posibil ca si de acolo browserul sa iti maltrateze site-ul.
Re: probleme aliniere header
Le-am specificat...dar nu vroiam sa umplu pagina de forum cu linii de cod....
<!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">
<!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">
Re: probleme aliniere header
OK, dar daca nu pui aici toata sursa sau daca nu il poti pune undeva online nu stiu daca te pot ajuta mai mult de atat...
Re: probleme aliniere header
COD HTML
<!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>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="../css/common.css" />
<link type="text/css" rel="stylesheet" href="../css/detalii_cumparator.css" />
</head>
<body>
<div class="header">Bine aţi venit</div>
<table cellspacing="0px" cellpadding="0px" width="1000px">
<tr>
<td class="buton_off"><a href="homepage.php">Pagină Principală</a></td>
<td class="separator"></td>
<td class="buton_off"><a style="padding-left:80px" href="">Detalii Film</a></td>
<td class="separator"></td>
<td class="buton_off"><a href="prelucrare_continut_cos.php">
Coş de Cumpărături</a></td>
<td class="separator"></td>
<td class="buton_off"><a href="../admin/homepage_admin.php">Zonă de Administrare</a></td>
<td class="separator"></td>
</tr></table>
</body>
</html>
COMMON.CSS
.body{
width:1000px;
margin:0 auto;
padding:0;
}
.header{
width:1000px;
height:60px;
background-color:black;
}
div.header{
font-size:28px;
font-weight:bold;
color:white;
text-align:center;
padding-top:40px;
}
.buton_off{
width:249px;
height:30px;
background-image:url(../poze_design/buton_off.gif);
}
.separator{
width:1px;
height:30px;
background-image:url(../poze_design/separator.gif);
}
td>a{
text-decoration:none;
font-size:21px;
font-weight:bold;
color:white;
padding-left:40px;
}
DETALII_CUMPARATOR.CSS
.aranjare_formular{
float:left;
width:800px;
padding-top:38px;
padding-left:130px;
padding-bottom:160px;
/*-webkit-padding-bottom:140px;*/
}
.buton_rosu{
height:30px;
padding-bottom:5px;
background-image:url(../poze_design/rosu.gif);
color:white;
font-weight:bold;
font-size:14px;
}
input:hover{
color:black;
}
Si daca tot am pus codul sursa nu inteleg de ce nu imi merge
-webkit-padding-bottom:140px;
Vroiam pe chrome un padding-jos mai mare ca se afiseaza footerul prea sus...
pe IE si mozzila se afiseaza ok...
eu lucrez cu nodepad++ si nu imi recunoaste -webkit-padding-bottom:140px;
ca fiind proprietate:valoare....
<!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>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="../css/common.css" />
<link type="text/css" rel="stylesheet" href="../css/detalii_cumparator.css" />
</head>
<body>
<div class="header">Bine aţi venit</div>
<table cellspacing="0px" cellpadding="0px" width="1000px">
<tr>
<td class="buton_off"><a href="homepage.php">Pagină Principală</a></td>
<td class="separator"></td>
<td class="buton_off"><a style="padding-left:80px" href="">Detalii Film</a></td>
<td class="separator"></td>
<td class="buton_off"><a href="prelucrare_continut_cos.php">
Coş de Cumpărături</a></td>
<td class="separator"></td>
<td class="buton_off"><a href="../admin/homepage_admin.php">Zonă de Administrare</a></td>
<td class="separator"></td>
</tr></table>
</body>
</html>
COMMON.CSS
.body{
width:1000px;
margin:0 auto;
padding:0;
}
.header{
width:1000px;
height:60px;
background-color:black;
}
div.header{
font-size:28px;
font-weight:bold;
color:white;
text-align:center;
padding-top:40px;
}
.buton_off{
width:249px;
height:30px;
background-image:url(../poze_design/buton_off.gif);
}
.separator{
width:1px;
height:30px;
background-image:url(../poze_design/separator.gif);
}
td>a{
text-decoration:none;
font-size:21px;
font-weight:bold;
color:white;
padding-left:40px;
}
DETALII_CUMPARATOR.CSS
.aranjare_formular{
float:left;
width:800px;
padding-top:38px;
padding-left:130px;
padding-bottom:160px;
/*-webkit-padding-bottom:140px;*/
}
.buton_rosu{
height:30px;
padding-bottom:5px;
background-image:url(../poze_design/rosu.gif);
color:white;
font-weight:bold;
font-size:14px;
}
input:hover{
color:black;
}
Si daca tot am pus codul sursa nu inteleg de ce nu imi merge
-webkit-padding-bottom:140px;
Vroiam pe chrome un padding-jos mai mare ca se afiseaza footerul prea sus...
pe IE si mozzila se afiseaza ok...
eu lucrez cu nodepad++ si nu imi recunoaste -webkit-padding-bottom:140px;
ca fiind proprietate:valoare....
Re: probleme aliniere header
Cu marginea de 8px de sus ai gresit in HTML, daca tot ai definit clasa body trebuie sa folosesti in HTML <body class='body'> ca sa ia in considerare margin: 0px auto;
Re: probleme aliniere header
DAP....ai dreptate..mersi mult de tot de raspuns...
Problema este ca nu era o intamplare ca nu am mai scris atributul class="body"
Din cunostintele mele teoretice de CSS...era un selector de tip element html....care nu mai trebuia sa fie mentionat in codul HTML...
chiar nu inteleg...mersi mult de raspuns....
Problema este ca nu era o intamplare ca nu am mai scris atributul class="body"
Din cunostintele mele teoretice de CSS...era un selector de tip element html....care nu mai trebuia sa fie mentionat in codul HTML...
chiar nu inteleg...mersi mult de raspuns....
Re: probleme aliniere header
Dap mersi...de informatii...
Dar nu am inteles de ce nu imi merge urmatorul cod CSS:(sunt nou in ale webdesing-ului)
.aranjare_formular{
float:left;
width:800px;
padding-top:38px;
padding-left:130px;
padding-bottom:100px;
-webkit-padding-bottom:140px;
}
Adica pe IE si mozilla mi se afiseaza ok...dar pe chrome nu....motiv pentru care vreau doar pe chrome un padding-bottom mai mare...
Eu folosesc notepad++ si nu mi se afiseaza -webkit-padding-bottom:140px; ca fiind proprietate:valoare;
Care ar fi problema?
Dar nu am inteles de ce nu imi merge urmatorul cod CSS:(sunt nou in ale webdesing-ului)
.aranjare_formular{
float:left;
width:800px;
padding-top:38px;
padding-left:130px;
padding-bottom:100px;
-webkit-padding-bottom:140px;
}
Adica pe IE si mozilla mi se afiseaza ok...dar pe chrome nu....motiv pentru care vreau doar pe chrome un padding-bottom mai mare...
Eu folosesc notepad++ si nu mi se afiseaza -webkit-padding-bottom:140px; ca fiind proprietate:valoare;
Care ar fi problema?
Re: probleme aliniere header
Invata sa folosesti right-click + Inspect Element > Metrics din Chrome si vei putea vedea si singur unde si care este problema.
Re: probleme aliniere header
Ok mersi de informatii
Re: probleme aliniere header
Freelancer Romania - Creare Site Web - Grafica Site Web - Logo Design ---
Re: probleme aliniere header
Aha...mersi...interesant website...
Înapoi la “HTML/JavaScript/CSS”
Cine este conectat
Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 10 vizitatori