Sverri

It is because you are using pixels ('px'). Pixels are a precise measurement, much like centimeters are. Pixels will not strech if you change the resolution, so 100px will always be 100px no matter what resolution you are using. What you need is to use either percentages (%) or not set the width at all, in which case the browser will figure it out itself. You could do it like this with percentages: #banner { position: relative; height: 150px; width: 80%; margin-left: 10%; margin-right: 10%; } #main { position: relative; height: 19cm; width: 20%; } The above code is just an example. You will need to adjust the numbers yourself. If you do not set the width yourself, you can instead give BODY some left and right padding: body { padding-left: 5%; padding-right: 5%; } Also: You should not use centimeters ('cm') in your stylesheets. They should only be used in stylesheets for printers. Instead you can use: px, em, ex and %.

You should use the HTML <button> tag, like this: <button type="button"><img src="buttonpicture.png" alt="button..." /></button> You can also apply a background using CSS: <input type="button" class="image"> input.image { background: #fff url(image.php) 50% 50% no-repeat; {

Do you mean, make a hyperlink into a functioning radio button? If so, then no, you cannot do that with CSS, nor would it be a good idea. Now, you can add a picture of a radio button as a background to your hyperlink, but that would be a purely cosmetic change, and would not change any functionality. a.radiobutton { padding-left: 15px; background: #fff url(radiobutton.png) 0 50% no-repeat; } I'm not sure I understand you question, though. If I didn't answer it, then care to clarify?