I have written code and on one page the menu turns out fine while the other it does not drop down as designed. Naturally it is only a problem with Internet explorer. But what is the difference in code on the two pages? I have looked and cant seem to find it, which I know its there. I do believe I have eliminated the css as a problem. Please please help, I don't what else to do. Any comments or suggestions help, even if its just a little info. I will paste a link to the two pages for you to see for yourself. http://floridaunderground.org/test/test.html http://floridaunderground.org/test/test2.html The first one works while the second one dont. Thank you so much in advance
You might easily see the differences using using Notepad++, but I hope you're quite comfortable with text-editing. And also, your test2.html looks better in my IE8.
Thank you very much for responding....you seen it I believe after I wrote some jquery for it last night. Which almost solved the problem just made it look a lil buggy. here is what happed, I wrote a website, everything looked great! uploaded it to another site and the menu bar gimped up for some reason. But html and css are client side, so that means something changed in my code from point a to point b....IDK, but it really messed me up. so I loaded the two codes from both sites to mine to notice there was a small file size difference...I ruled out the css tho
*** WARNING *** This may seem harsh, but somebody needs to give you a hefty dose of truth... Transitional markup, meaning the code is in transition from 1997 to 1998. This is evident with the CSS inlined in the markup for no good reason, tables for layout, nothing REMOTELY RESEMBLING semantic markup or separation of presentation from content... I see bold tags doing heading's job, paragraphs around non-paragraph content, pointless CSS stated over and over and over again on nearly every line of HTML, tags like <p /> that don't exist, not even in XHTML -- and that's not even scratching the surface of your issues. Which is probably a hefty part of why I'm seeing seven different layouts in the big four modern browsers and the past 3 IE's. Lands sake it's not even the same between Safari and Chrome, when those use the same engine. As I tell a GREAT many people, there is NOTHING worth even TRYING to save of this sites code since it has it's head wedge so firmly up 1998's backside, we'd have to shove a crate of dynamite down 1997's throat to blow it clear. You literally should throw that train wreck of outdated garbage in the trash, and start over from scratch with MODERN coding practices by semantically marking up your content, and then bending it to your will with CSS -- preferably with MODERN layout techniques like fluid or semi-fluid layout and possibly even responsive design -- because the crappy little fixed width stripe with inaccessible fixed metric fonts is not how a website should be built. oops, pipe bomb...
Well...at least you know I didn't copy any of it, use any generators and did it all with notepad. Im sorry my coding bothers you that much and thank you for your comment. and what system I use for my sizes dont matter. the <p /> tag is a bad habit that works just fine and im sure everyone else knew that it was meant for <p> ill just use jquery to fix my problem as I have already started. Like I said any suggestions help, even tho your comment was way off topic of the help I needed. and as wise words were once gracefully pass to me: *** WARNING *** This may seem harsh, but somebody needs to give you a hefty dose of truth... YOU ARE AN A$$HOLE oops, pipe bomb... I may come back, or I may not. so if not, its been fun and thank you hdewantara for kindness
Don't take the bullet out of the wound and sew it up, pour crazy glue on it and hope the bleeding stops. That's what's wrong with the web these days.
No, it was on topic to the help you needed given your site is broken in not just IE, but is different in EVERY version of IE and every modern browser. SOMEBODY needed to tell you that it's stuck in 1997 practices and that's 99% of why it will NEVER be accessible or work properly across modern browsers, much less on all the other things that are important to building a website... certainly far more helpful than slapping the rose coloured glasses on your head, patting you on the back, and continuing to allow you to be led down the garden path... Which to be frank given your response, sounds like what you were after. Truly a laugh how people come to a site like this, ask what's wrong, you actually tell them, and they get their knickers in a twist. This: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" ><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="en" /> <meta name="viewport" content="width=device-width; initial-scale=1.0" /> <link type="text/css" rel="stylesheet" href="screen.css" media="screen,projection,tv" /> <title> East Jackson County Economic Development Council </title> </head><body> <div class="templateSandbag"></div> <div class="shadowSandbag"><div></div></div> <div id="pageWrapper"> <h1> <span>East Jackson County Economic Development Council</span> </h1> <ul id="mainMenu"> <li> <a href="/test/index.php">Home</a> </li><li> <a href="/test/projects.php">Projects</a> <ul> <li><a href="/test/down/eventsponsoring.pdf">Event Sponsorship</a></li> </ul> </li><li> <a href="/test/About.php">About Us</a> <ul> <li><a href="/test/organizationaldetails.php">Organizational Details</a></li> </ul> </li><li> <a href="#">Links</a> <ul> <li><a href="http://www.sneadsfl.com">Town of Sneads</a></li> <li><a href="http://www.jacksoncounty.com">J.C. Chamber of Commerce</a></li> </ul> </li><li> <a href="/test/memberbusiness.php">Members Businesses</a> <ul> <li><a href="/test/botm.php">Business of the Month</a></li> </ul> </li><li> <a href="#">Commercial Properties</a> <ul> <li><a href="/test/seminolecommercepark.php">Seminole Commercial Park</a></li> <li><a href="/test/combuildings.php">Available Commercial Buildings</a></li> <li><a href="/test/comlots.php">Vacant Commercial Lots</a></li> </ul> </li><li> <a href="#">Become a Member</a> <ul> <li><a href="/test/memberbenefits.php">Member Benefits</a></li> <li><a href="/test/down/memberapplication.pdf">Membership Application</a></li> </ul> </li><li> <a href="#">New Business Incentives</a> <ul> <li><a href="/test/businessassistance.php">Business Assistance Prog.</a></li> <li><a href="/test/jcdcbenefits.php">JCDC Benefits</a></li> </ul> </li> </ul> <hr /> <div id="slides"> <img src="images/slide/100_0350_thumb.jpg" alt="describe this!" /> <img src="images/slide/sneads_thumb.jpg" alt="describe this!" /> <img src="images/slide/ACI_thumb.jpg" alt="describe this!" /> <img src="images/slide/commercepark2_thumb.jpg" alt="describe this!" /> <img src="images/slide/dam2_thumb.jpg" alt="describe this!" /> <img src="images/slide/jimWodruffDam_thumb.jpg" alt="describe this!" /> <img src="images/slide/ochesseePond_thumb.jpg" alt="describe this!" /> <img src="images/slide/sneadsPark_thumb.jpg" alt="describe this!" /> <img src="images/slide/threeRivers_thumb.jpg" alt="describe this!" /> <img src="images/slide/threeRivers2_thumb.jpg" alt="describe this!" /> <!-- #slides --></div> <p class="tagLine"> Dedicated to preserving a way of life while enriching our communities through job creation. </p> <div id="businessOfTheMonth"> <h2>Business of the Month</h2> <div class="business"> <h3>Blondies</h3> <img src="images/botm/blondies.jpg" alt="Blondies" class="plate" /> <p> Pictured: Blondie's Manager, Janet Fugate and her staff<br /> EJCEDC Members: Homer Hirt and Mary Neal<br /> 2011 Beauty Queens from Sneads and Grand Ridge </p> <!-- .business --></div> <div class="business"> <h3>Chipola Surgical</h3> <img src="images/botm/chipolasurgical.jpg" alt="Chipola Surgical" class="plate" /> <p> Pictured: Sneads Clinic Staff, Abby Strickland, MSN, ARNP, Melissa Gordon, LPN and Julie Miles, Office Manager <br /> EJCEDC Members: Helen Grice, Homer Hirt, Mary Neal, Teresa Brown and Sherri Griffin </p> <!-- .business --></div> <div class="business"> <h3>Glamour Boutique</h3> <img src="images/botm/glamourboutique.jpg" alt="Glamour Boutique" class="plate" /> <p> Pictured: Owner, Sheila Braddy, Stylists Jessica Dudley, Genice Moneyham, and Leah Jeter<br /> EJCEDC Members: Helen Grice, Connie Butts, JR Moneyham, Homer Hirt, Jason Johnson, Mary Neal and Mary Daniels </p> <!-- .business --></div> <div class="business"> <h3>Iris Flowers</h3> <img src="images/botm/irisflowers.jpg" alt="Iris flowers" class="plate" /> <p> Pictured: Owners George and Iris Melvin<br /> EJCEDC Members: Homer Hirt, Helen Grice, Mary Neal and Teresa Brown </p> <!-- .business --></div> <div class="business"> <h3>Kiddie Campus</h3> <img src="images/botm/kiddiecampus.jpg" alt="Kiddie Campus" class="plate" /> <p> Pictured: Owner Judy Jeter, Sandra Jeter, June Fosnaugh, Kayla Bass and Tammy Durden<br /> EJCEDC Members: Helen Grice, Jason Johnson, Teresa Brown, Homer Hirt, Genice Moneyham, and JR Moneyham </p> <!-- .business --></div> <div class="business"> <h3>McDaniel's Grocery</h3> <img src="images/botm/mcdanielsgrocery.jpg" alt="McDaniel's Grocery" class="plate" /> <p> Pictured: Billy Knight III, Chris Wilson, Cody McDaniel, Henry Highsmith, Wesley Wester, Jessica Branch, Josh Rodgers and members of EJCEDC. </p> <!-- .business --></div> <div class="business"> <h3>Omega Technologies</h3> <img src="images/botm/omegatechnologies.jpg" alt="Omega Technologies" class="plate" /> <p> Pictured: Owner Jason Johnson (seated), and (standing, from left) Roy Baker, Helen Grice, Karen Fader, Mary Neal, Mary Daniels and Greg Lewis. </p> <!-- .business --></div> <div class="business"> <h3>Seminole Outdoor Supply</h3> <img src="images/botm/seminoleoutdoorsupply.jpg" alt="Seminole Outdoor Supply" class="plate" /> <p> Pictured: From left, JR Moneyham, Doug Bryan, Teresa Brown, Homer Hirt, Karen Fader, Connie Butts, and Jeanie Sangree </p> <!-- .business --></div> <div class="business"> <h3>Something Special</h3> <img src="images/botm/somethingspecial.jpg" alt="Something Special" class="plate" /> <p> Pictured: JR Moneyham, Mary Daniels, David Briggs, Debbie Briggs, Teresa Brown and Helen Grice. </p> <!-- .business --></div> <div class="business"> <h3>Captain's Table</h3> <img src="images/botm/captainstable.jpg" alt="Captain's Table" class="plate" /> <p> Pictured: From left, Helen Grice, Jerry Scott, John Stevens, Owner Kathy Tyus, Joyce Auer, Mary Neal and Ronnie Tyus. </p> <!-- .business --></div> <!-- #businessOfTheMonth --></div> <hr /> <div id="footer"> <div class="contact"> EJCEDC<br /> P.O. BOX 1072<br /> SNEADS, FL 32460<br /> (850) 593-6636 Or (850) 592-4621<br /> <a href="mailto:townofgrandridge@embarqmail.com">Info@ejcedc.org</a> <!-- .contact --></div> <hr /> <div class="faceBook"> <a href="http://www.facebook.com/pages/East-Jackson-County-Economic-Development-Council/152741348166905"> <img src="images/facebook.png" alt="Visit us on Facebook" /> </a> <!-- .faceBook --></div> <hr /> Hosted by Omega Technologies<br /> http://www.omega-tech.us<br /> <a href="admin.php">Login</a><br /> <!-- #footer --></div> <!-- #pageWrapper --></div> </body></html> Code (markup): ... is probably all it should have for markup (minus the image rotating script, that can be made far, FAR smaller without jquery). EVERYTHING else you are doing there belongs in the external stylesheet. This gives you headings for headings, horizontal rules where headings are unwanted/inappropriate, paragraphs for (kind-of) paragraphs, and reduces the overall code to a fraction what you had -- and less code is easier to maintain. You gimme a bit and I'll toss up the CSS that would make that work for your existing layout -- NOT that I'd keep that layout given the host of accessibility issues inherent to it... hmm, have to remaster the images too since they're not viable for web deployment either... what with a BMP (not even a web format), JPEG doing PNG's job on a few elements, and relying on the browser to scale them instead of pre-scaling them...
... and here is the complete rewrite. http://www.cutcodedown.com/for_others/blade54015/template.html As with all my examples the directory is wide open: http://www.cutcodedown.com/for_others/blade54015 ... for easy access to it's gooey bits and pieces. I resized all the images to the sizes actually used on the page, which by itself threw a megabyte of wasted bandwidth in the can... I replaced that funky javascript with something a bit cleaner/simpler, letting all the content images be stored in the markup where they belong (kinda -- that's somewhat debatable). The new script is pretty simple, it makes a pointer at the firstChild IMG, removes it from the DIV and append it to the end of the div (after skipping/deleting any whitespace). It's never actually deleted because Javascript won't de-allocate an object so long as a valid pointer to it still exists. We don't end up flooded with pointers or memory issues because we're just swapping in/out the pointers instead of actually cloning the node. It takes the semantic markup above with one or two minor changes, and turns it into a responsive layout -- which means it will auto-adjust the layout to fit narrower widths... IE8/lower will get the widest layout, which is 1152+ wide friendly. Still needs some work as this is a quicky -- but it's already more functional and more stable cross browser. Some of your layout concepts were difficult to work with because you designed to 800 wide, but 800 wide isn't 800 friendly -- you have to take 32px or so off for things like scrollbars... if you meant to make a 800 friendly design, you needed to use 768 as your width... Though I think that may have been you designing to 1024 friendly but using extra elements to put that drop shadow on it. Using CSS3 makes the drop shadow simpler to do with far less code... and if IE8/lower doesn't get that shadow, OH WELL. (really shouldn't be a deal breaker anymore). That should at least give you a modern jumping off point... If you like, I can toss together a section by section breakdown of the why/what/where of the markup and CSS. Took me a bit longer than planned -- once I get started dicking around with images I lose track of time.
It's what Dan used to call "silver bullet" fixes -- people come in with an already written site thinking they can get a one-shot fix, when the problem at hand is just an indicator of deeper rooted issues that run right to the bone. Giving them the silver bullet with the site's name on it does nothing for the next issue, or the one after, or the one after that which WILL crop up from the festering rot underneath. It's more like slapping Spackle and white-wash a dry-rotted support beam -- it might look OK for a few weeks -- right up until the building collapses. -- edit -- Oh, in going through and doing that rewrite, I found 99.99% of why it's broken... EVERYTHING is absolute positioned instead of letting flow do it's job.
Deathshadow, it wasn't what you said....just the way you said it. That is all that bothered me, you obviously know what you are doing and I know that. But I would have respected your comment a little more if worded differently. But thank you for your help, I truly mean it...the covering up with jquery was a last resort thing. Thanks again, ill look over all of it and read it in depth.
When you see the same junk month after month, year after year, writing a long, drawn-out, polite post becomes not only tiresome, but annoying. But people would probably get annoyed if DS just told people to go to the links in his sig, which say the same things in a nicer way. It wasn't his response to you, it was writing the same response for the 500th time.