Forum Moderators: open
Im just learning so bare with me. I want my website to appear in the middle of all the the different window sizes.
Ie: on 800x600 windows my site takes up all the window, and on the sizes up from that the site appears in the middle with slightly coloured borders either side. I did read it somewhere how to acheive this but cant find it again. Or should I just design my new site for 1024x768 and not worry about the rest. I have 24% of my veiwers on 800x600 windows though. Should I do the borders? (if so can you tell me how) or should i just design for the slightly larger window.
Please help all.
Thanks Geoff
<html style="width: 100%; background-color: #fcc;">
<body style="width: 800px; margin: auto; text-align: center; background-color: #fff;">
Birdman
[edited by: Birdman at 8:04 pm (utc) on July 14, 2006]
should I place it within the actual css file page or the HTML page?
You may do it either way. I did not know if you used an external CSS file so I just show you an "inline" example.
You could use this in your external CSS:
html {
width: 100%;
background-color: #fcc;
}
body {
width: 800px;
margin: auto;
text-align: center;
background-color: #fff;
}
got it sorted and am very pleased with the resuld.
just on another note, have tried to create a simple rollover effect on an image. I have a black and white image and created the same image but slightly coloured in fireworks the same size.
when i preview in browser, it brings up the coloured image but makes it smaller too. I dont want it smaller. Is there a way i can achieve this?
geoff
Oh, yeah...your welcome! Glad you got it sorted out.
[edited by: Birdman at 3:54 pm (utc) on July 16, 2006]
Got some come that is meant to do the rollover for me. As I said the first image is how I want it, but the image that appears when mouse is moved over is reduced in size (like its been pressed in)
<a herf="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/imagecolor1.gif',1)">
<img src="images/image1.gif" name="Image8" width="160" height="70" border="0"></a>
Thats what dreamweaver codes the rollover when I insert it using the insert rollover and browse and place the images that way.
Hope you can help.
Thanks Geoff
Also check the real dimensions of the images. Are they both 160px by 70px?
<img src="images/image1.gif" name="Image8" border="0">
You know when you just do summit so simple and stupid and dont realise it, I exported the image to fireworks to change the colour tone on image but didn't 'fit to canvas when i finished so the image i ACTUALLY exported was 10px bigger each way.
Sometimes it just takes someone to remind you of a fact for you to realize.
Many thanks.
Geoff
Aswell as the image changing on rollover I want to place a url on it so it can be clicked and taken to another page. How?
Geoff
To make it link to an URL, just put the URL in the "href" attribute.
<a href="http,www.domain.com/page.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/imagecolor1.gif',1)">
<img src="images/image1.gif" name="Image8" width="160" height="70" border="0"></a>
Birdman
take care web freind.
