
February 5th, 2013, 10:15 AM
|
|
Registered User
|
|
Join Date: Feb 2013
Posts: 2
Time spent in forums: 11 m 57 sec
Reputation Power: 0
|
|
|
Css image help
See i have this code for
Html page
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"href="style2.css">
<title>EndOfLine-Recommendation</title…
</head>
<body>
<div id="wrapper">
<header><img src="logo.png"></header>
</div>
</body>
</html>
css page
html
{
width:100%;
height:100%;
padding:0;
margin:0;
max-width:100%;
max-height:100%;
overflow:auto;
background-attachment:fixed;
background-color:black;
}
body
{
position:relative;
width:100%;
height:100%;
padding:0;
margin:0;
max-width:100%;
max-height:100%;
overflow:auto;
background-attachment:fixed;
background-color:black;
}
#wrapper
{
position:relative;
height:100%;
width:100%;
padding:0;
margin:0;
background:url("background.jpeg");
background-repeat:no-repeat;
background-color:black;
max-width:100%;
max-height:100%;
overflow:auto;
background-attachment:fixed;
}
header
{
position:relative;
left:25%;
max-width:100%;
max-height:20%;
height:20%;
}
header img
{
display:block;
position:relative;
width:50%;
height:70%;
max-height:70%;
max-width:50%;
}
the problem is that when i zoom out in the browser the logo remains of the same size but everything else becomes small but i want that the image also becomes small as i resize.Here is the link to the screenshot image [IMG]postimage.org/image/xg3fbn7s5/[/IMG] .I am new in css so please help me
I really appreciate it.
|