Problem z hiperłączem w obrazku oraz rozmiarem.

pytanie zadane 22 grudnia 2015 w HTML i CSS przez hasket11 Użytkownik (770 p.)

Witam, podczas tworzenia strony internetowej napotkałem dwa problemy.

Po pierwsze nie działa mi hiperłącze, kiedy klikam na obrazek FB.

Po drugie nie wiem jak rozwiązać problem z rozdzielczością tzn. u mnie strona wygląda inaczej, niż u mojego kolegi w takim sensie, że on ma większe tło, a ja mniejsze.Różnica wynika prawdopodobnie z tego, że on ma monitor FullHD, a ja HD i mamy inne rozdzielczości.Czy da się jakoś rozwiązać ten problem, żeby u każdego, nie zależnie od rozdzielczości strona wyglądała tak samo?

Pozdrawiam i życzę Wesołych Świąt!

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="utf-8" />
	<title>Devide</title>
	<meta name="description" content="Serwis poświęcony grupie Devide.Zajmujemy się nagrywaniem filmów." />
	<meta name="keywords" content="wide, filmy, nagrywanie, fotografia, 4k, dslr, " />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	
	<link rel="stylesheet" href="style.css" type="text/css" />
  
</head>
<body>

    <div id="container"> 
       
        <div id="header">
        <img   src="img/header/header-foto.png"   />
        </div>       
        
            <div id="font"> 
            <img src="img/header/logo.png" />
            </div>
        <div id="FB">
        <a href="http://facebook.com">
        <img src="img/header/FB.png" />
        </a>
  
        </div>
        <div id="Insta">
        <img src="img/header/Insta.png" />
        </div>
        <div id="YT">
        <img src="img/header/YT.png" />
        </div>
        <div id="Vimeo">
        <img src="img/header/Vimeo.png" />
        </div>
                
    </div>
    
    
</body>
</html>

#header{
  
        width:1920px;
        height: 1080px;
        margin: top;
        top:0;
        margin: left;
        left:0;
        position:absolute;
        position:fixed;   
        z-index: 1;

}
#font{
        position: absolute;
        position:fixed;
        z-index: 2;
        width: 100%;
        text-align:center;
        clear: both;
        position: relative;
        margin: 0 auto;
        padding-top: 350px;
}
#FB{
        z-index:3;
        position: absolute;
        position:fixed;
        padding-top: 280px;        
        padding-left: 820px;
        border: 0;
    
         

}
#Vimeo{
        z-index:4;
        position: absolute;
        position:fixed;
        padding-top: 280px;        
        padding-left: 980px;
    
    
       

}
#YT{
        z-index:5;
        position: absolute;
        position:fixed;
        padding-top: 280px;
        padding-left: 1060px;
       
}       

#Insta{
        z-index:6;
         position: absolute;
        position:fixed;
        padding-top: 280px;
        padding-left: 900px;
}

2 odpowiedzi

odpowiedź 22 grudnia 2015 przez Eimens Maniak (69,240 p.)

Żle:

<a href="<a href="http://facebook.com" rel="nofollow" target="_blank" original-title="" title="">http://facebook.com</a>">
<img src="img/header/FB.png" />
</a>

To nie ma prawa działać :p

Dobrze:

Background-size: cover;

Poczytaj o RWD