Look Realty is what I’m working on.
There are three issues right now I’m tackling that are of greatest importance.
Having the site viewable across all browsers. Is there something called Fixed Width so it adjusts. I can see this site in a 21" screen but not a 17" and I think I should.
Getting the links to the center and having the nav bar run the length of the site.
Centering the site.
Any info is greatly appreciated.
John
Wow ok,
Firstly you should put your CSS in a seperate file instead of in the head of your document.
Secondly you have ALOT of unnecessary divs and should really look into some basic HTML / CSS layout tutorials to get a better understanding of how to markup your site.
You have a div with the id of everything and used positon:absolute; which currently is keeping “everything” on your site to the left - You should use margin:auto; to get the site central.
As for the navigation you would need to have this outside of any container to get it to run the width of your site while having the actual navigation “contained” within a div or use a background image that aligns with your navigation (use repeat-x to have it repeat horizontally).
It also is rather slow to load.
Hi,
You cant make a site a with a fixed width of 1300px and then expect it to fit on anything except for devices capable of viewing 1300px Im afraid.
If you want it to adjust to smaller or larger screens then you would need to start again from scratch and create flexible components and do away with things like your 3 fixed length elements that span the middle of your site. The left and right images would either need to be sliced and diced and expandable and contain text that can shrink and grow as required or at the very least be images that resize (i.e. percentage widths).
A fluid site is built carefully from the ground up and not really something you can bolt on later. When you choose a fixed width site at the start you must make sure that the width you are choosing is one that you can happily live with. 1300px is much to wide in my opinion and 940px width would be a more suitable size but of course not as desirable has having fluid/elastic site.
To center the site as mentioned above you should do way with the fixed positioning and use static containers that have a width and use auto margins. As you want the navbar to be 100% wide then you can’t use the parent wrapper for centering but instead you would need three containers. One for the header one for the navbar and one for the rest of the content. The header and content would be the fixed width and use auto margins and then the navbar would be 100% wide for the background image with a nested inner element at the fixed width and using auto margins to center it.
thank you for these comments. both are great and I didn’t know how bad it was. Looks like it will have to be started over from scratch as its an important first page. If anything else or an idea of the fluid site I appreciate it. I’m learning bit by bit.
Thanks again,
john
You can find quite a few examples on Google but I would avoid ones using the grid system. Here’s a very old [URL=“http://www.pmob.co.uk/temp/3col-min-max-basic.htm”]basic example of one of mine.
Some other advice? Forget the HTML 5 nonsense declaration and use a RECOMMENDATION instead, Ease up on the numbner of DIV, learn how to use heading tags, don’t use tables for layout, avoid using the STYLE attribute as generally that has no place in your HTML, avoid wasting block level containers inside list items (though that’s the bloated slider nonsense), avoid wasting bandwidth on “javascript for nothing” effects like that slider… and get some COPY on the page; as in ACTUAL TEXT given that images off or even CSS off, the page is useless.