Bu kadar zor olmamalı aslında responsive

Yazdığın CSS kodunu paylaşır mısın ?
Sitenin kendii iç kısmı kolayca uyuyor mobile.Siteyi baştan aşağı değiştim problem olmamıştı.Ama ayrı bir header tasarlayıp o headerdekileri mobil uyumlu yapmak ise siteden bağımsız çalışıyor gibi. Görsel kenara gidiyor,buton görselin üstüne.Sonra çözünürlük değişiyorum bakıyorum farklı problem. Bu arada CSS bilmeden diğer kodlara bakarak tahminen yaptığım için benden kaynaklı hatalar olma ihtimali de yüksek

.headeryazisi{
top:42%;
left:57%;
margin:-30px;
font-size:16px;
position:absolute;
}
.hedex a {
background-color:#17cf60;
color:#fff;
font-size:20px;
font-weight:bold;
width:410px;
border-radius:3px;
padding:5px;
position:absolute;
top:35%;
left:57%;
text-decoration:none;
margin:-30px;}
.headerimage {
top:20%;
left:10%;
margin:0px;
position:absolute;
margin:-30px;
}
.headerside{
background: rgb(244,250,254);
background: -moz-linear-gradient(top, rgba(244,250,254,1) 0%, rgba(240,240,240,1) 100%);
background: -webkit-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(240,240,240,1) 100%);
background: linear-gradient(to bottom, rgba(244,250,254,1) 0%,rgba(240,240,240,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4fafe', endColorstr='#f0f0f0',GradientType=0 );
height:600px;
}
@media screen and (max-width: 600px) {
.headeryazisi {
top:450px;
left:45px;
margin:0;
margin-top:25px;
position:absolute;
display:none;
}
}
@media screen and (max-width: 600px) {
.headerimage{
top:90px;
margin-right:0px;
}
}
@media screen and (max-width: 600px) {
.hedex a {
padding:2px;;
width:270px;
margin-left:-440px;
font-size:14px;
margin:-161px;
margin-top:40px;
top:570px;
display:none;
}
}
@media screen and (max-width: 600px) {
.headerside {
height:379px;
}