Jump to content

Center


ben3001
 Share

Recommended Posts

hey peoplealot of people keep saying your site is not centered with the headers and i really dont know how i would acheive it

Do you mean YOUR site or OUR site (reffering to w3schools.com)I think your site looks fine :)
Link to comment
Share on other sites

yea i mean my site, for example my site has to be maximized for it to appear in the center, im sure there is css that would allow me to accomplish this.reason being if i resized the browser window, half the content would be missing, i would want is so that the content always appear in the center, no matter what the resolution isim viewing my site at 1024*768 and some people have been viewing the site at a much higher resolution, i would like it if it always appears central

Do you mean YOUR site or OUR site (reffering to w3schools.com)I think your site looks fine :)

Link to comment
Share on other sites

2 things1. Your image is to big, resize it so that it fit's into the 800x600 resolution2. change any css position:absolute to position:relative and the px to % :)

Link to comment
Share on other sites

ok ive kind of got the site centered but the postioning now is that each div appears below each other, ie in a diagnol positioning first the right div then below that at the corner appears the middle div and then below tht appears the right div at the corner eg9af.pngheres the css

a:link {color: #A2D800;text-decoration:none;font-family: verdana;font-size: 10px;}a:visited {color: #8EA707;font: bold 10px verdana;text-decoration:none;}a:hover {color: #E2FF8A;font: bold 10px verdana;text-decoration:underline;}a:active {color: #F0F0F0;font: bold 10px verdana;text-decoration:underline;}body{scrollbar-face-color:#A2D800;scrollbar-arrow-color:#000000;scrollbar-track-color:#333333;scrollbar-shadow-color:#000000;scrollbar-highlight-color:#NNNNNN;scrollbar-3dlight-color:#NNNNNN;scrollbar-darkshadow-Color:#NNNNNN;}body,a {font: bold 10px verdana; color:#ffffff;}body {background-color: #1F1F1F;}h1 {   font: bold 20px        verdana;   color:#ffffff;}.left{position:relative;left:4%;text-align: center;width:130px;background-image: url(images/top4.png);background-repeat: repeat-x;border-style: solid;border-width: 0px 1px 1px 1px;border-color:#A2D800;height: 72%;top: 0%;}.right{position:relative;left:84%;text-align: center;width:130px;background-image: url(images/top4.png);background-repeat: repeat-x;border-style: solid;border-width: 0px 1px 1px 1px;border-color:#A2D800;height: 72%;top: 0%;}.middle{position:relative;left:20%;width:570px;background-image: url(images/top4.png);background-repeat: repeat-x;overflow:auto;border-style: solid;border-width: 0px 1px 1px 1px;border-color:#A2D800;padding:2px;top:5%;}.top{text-align: right;left:100px;width:900px;top: 140px;}.table{padding-bottom:3px;border-style: solid;border-width: 6px 1px 1px 1px;border-color:#A2D800;}

Link to comment
Share on other sites

In that screenshot it looks like the div on the right is too high, either add a <br> after the top div or giv some more margin.Also, you don't need to make images or banners to fit in 800x600. You can make a banner that will display correctly for both 800 wide or 1600 wide, it will just display less of the image for smaller sizes (but won't scroll).

<div style="width: 100%; height: 80px; background-image:url(path/to/image); background-position: center center; background-repeat: no-repeat;"> </div>

This will create a div and apply your banner as the background image. It will center the background image in the div (i.e. the center of the image, however big it is, will be in the center of the div). So you can make a large banner, but keep the name smaller than 800px, and center it. On either side of the name you can just put some artwork. If they only see 800px, then they see the name and nothing else. If they are on a larger resolution, then the banner will expand out on either side to show the artwork on the sides, but the title will still be centered.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...