Need help. Newbie here. I'm working on a menu using css. The problem with this is I can't figure out how to center the menu. I don't want to use a div or an align in the cell, because it may be used in several areas on the web site I work on. Any clues? Please reference this: freertool.com/Untitled-1.html
1. There's no need to put the menu in a DIV or a Table, in fact the table is adding the extra space around the menu. 2. You've set the menu to 100% width, something that has a width of 100% will span 100% across the screen, so it will automatically be centered, because it goes from one end to the other (the only reason yours doesn't is because of the table) 3. Why are you using JS to write your menu? You do realise people without JS, inclduing google won't be able to see your menu, is your aim not to get indexed?
It will be in a cell in a table, it's replacing a menu created in Fireworks which has an incredible amount of images and code currently. The current menu is difficult to update (537 pages use it currently!) It seems to me that JS would be better, updating the entire site's menu would be done in one file. I'm open to other suggestions, I decided to use JS due to ease of editing. I do want to get indexed, so again open to other suggestions
Why does it have to be a cell in a table? there's no need to use tables for layouts. Also you could use PHP to include your menu, so it's stored in one page and you can just include it. For example save all of the menu in a file called menu.php Then wherever you want to include the menu use the code: <?php include('menu.php'); ?> Code (markup): Note your files must be saved as .php exstension and you have to have php installed on your server!!
The current layout uses tables and I've got a limited amount of time to update. So I'm trying replace the menus inside table cells. I'll look into php for this. I'm assuming that by using php, I get around the concerns of browsers not rendering css or JS? Also, if using a 'menu' created with php, will there be any indexing issues?
<table align="center" width="99%" border="1"> Code (markup): Toy with that code, try to modify the with %, it may be able to work.
Nope PHP is a server-side language therefore everything is parsed by your server, so nothing is reliant on the client. Whereas JS is a client-side language and is reliant on the user having JavaScript. There are no indexing concerns to be worried of, PHP includes are the most common way of including common files, like headers, footers and menus, and are used on millions of sites. This is the method you are looking for. If you really must use tables then you need to need to add border-collapse:collapse; and border-spacing:0; for the table to remove the spaces around the table.
wd_2k6 has it right - javascripted menu is a giant steaming pile of /FAIL/... get rid of it... Though you say it's going into a 'cell' on a larger layout - that means table for layout which is also a colossal steaming pile of /FAIL/ - meaning you probably should throw out the entire site and start over from scratch with clean semantic MODERN markup and separation of presentation from content. Though if the parent default index is the page in question, then yeah, chuck it and start over with MODERN coding techniques. You might want to do yourself a favor and take an axe to that giant flashtard rubbish too since for users like me all I get is a blank page with no content. The constantly jumping page content on hovers and other layout issues are a sure sign of over-thinking what looks like it should be a relatively simple page.
Here, did you a favor. Here's how I'd write the home page you currently have: http://www.cutcodedown.com/for_others/fhahnel/template.html I wrote up an example of breaking it into pieces using php http://www.cutcodedown.com/for_others/fhahnel/template.php As always, the directory is unlocked so you can grab the bits and pieces: http://www.cutcodedown.com/for_others/fhahnel In particular you will want to look at the phps files which show you the source code for the .php's http://www.cutcodedown.com/for_others/fhahnel/template.phps http://www.cutcodedown.com/for_others/fhahnel/includes/header.phps http://www.cutcodedown.com/for_others/fhahnel/includes/footer.phps Since you know javascript you should be able to follow that code and how it works. PHP is pretty simple. <?php starts a php section, ?> ends one - I like to only do that once per file... echo is the equivalent of document.write, if you use single quotes echo is whitespace neutral (a huge advantage IMHO in making clean code), and all variables start with $ and there is no VAR keyword. Apart from that, it's not all that different. My rewrite is valid XHTML 1.0 Strict, would be valid CSS 2 if not for a few browser-specific properites like zoom and -moz, tested working 100% in IE 5.5, 6, 7 & 8, FF 2 & 3, Opera 9.64 and 10, and the latest flavors of Safari and Chrome. You'll notice I use a H1 for the site title with the text, and style that test to be close to the image, then place the image over that text with the span. This is called Gilder-levin image replacement and means people browsing with images disabled won't be left out in the cold. (take a look at the page images off). I also went through and optimized your images down to 11k instead of the 40+ you had. Min-width and the IE6/earlier expression equivalent were added since the layout (including your original) starts to break down narrower than that. I'd consider adding a max-width as well since you could end up with really long lines of text that way. ... and not a table to be found since there was nothing on the page that warranted a table. Hope this helps - any questions fire away.
It's now out of a table cell and centers properly. I'm going to also look into advice given by Deathshadow. This is a really great forum and helpful. URL: www.freertool.com
I used the example for the following link: www(DOT)freertool(DOT)com/landing/landing_welding(DOT)html Wasn't sure about the header nav and footer nav so I just used the absolute links Question: How can I create a nav bar (similar to my previous header.js file) that I can use throughout the site rather than coding a <UL></UL> on every page? Fred
Look at my phps examples - all your pages can share the same header.php and footer.php, since the only thing that should be changing is the stuff between the two.