I am in the process of a site makeover and am now using php file extensions and have put a couple of "include_once" calls on my page and everything seemed good in Firefox. However, when I view the page in IE, it's all mis-aligned and the menu has lost all css qualities. Obviously, I did something wrong. Please take a look at housedogg.com/test/myweb15/index.php If possible view it in both IE and FF to see the difference.
I can't see any misalignments. Tested it in IE9 and switched browser mode to 8 and 7 - no misalignments. I assume you are using IE6? If that's the case - Just don't worry. I was away for a few months but I am pretty sure that the general consensus still is: Forget IE6
Well, there's a decent amount wrong with that markup -- I'm surprised it only has 8 validation errors, but it is a tranny so the looser structural rules lets all sorts of stupid mistakes and bad code through; in many ways you're relying on the error correcting of the browser instead of valid code; but that goes hand in hand with the meaning of "transitional" as basically you're saying the code is in transition from 1997 to 1998 coding practices. On top of the stuff validation picks up like trying to use the same ID more than once and trying to put block level containers (like DIV) inside inline-level tags (like A) -- which you can't do [/i](even though 5 claims it's now safe, I've found that to be 100% grade A farm fresh rose fertilizer)[/i] -- it's knee deep in how not to build a website with the nonsensical use of numbered headings, clearing DIV like it's still 2001, endless pointless broken JavaScript bloat for Christmas only knows what, static scripting inlined in the markup, comment placements (yes, I said COMMENTS) that could be tripping rendering bugs in IE and some versions of FF, anchors wrapping anchors, presentational images in the markup with no images off graceful degradation, pointless META nothing uses and/or restates default values, no media targets for the CSS LINK, etc, etc... Which is why you've got 12.4k of markup for 320 bytes of plaintext, two forms and ONE content image -- easily two or three times the HTML that should be present for such a simple page... which also means your PHP has to work twice as hard outputting more code than it should have to. ... and that's before talking that I'm seeing five different layouts in five different browsers (IE9, IE7, Opera, FF and Chrome) -- none of which look like they're intentional design. While I wouldn't even try to work with the CSS given it's been minified -- which in my experience usually amounts to using bandwidth as an excuse to hide/obfuscate bad/broken/poorly written code... entirely likely since it appears that parts of some HTML 5 polyfill/shiv/whatever they're calling it this week are in the CSS, when you're working in a X 1.0 Tranny document. As I often tell people, to 'fix' it I'd have to throw all that markup away, there's NOTHING worth trying to save from it.
A simple "you're code is sketchy" would have answered my question. But thanks for the input, I guess I need more practice.
The path to the page that is acting up is "http://housedogg.com/myweb15/index.php Please take a look and let me know if you see anything that would cause it display differently in IE. Thanks,
When you don't have a doctype, IE does stupid things. In addition, the doctype must be the first thing, before any spaces / comments / etc.
@xtmx- Thanks for the great tip. I didn't bother putting the doctype or meta tags because I was just playing with the layout, but I had no idea that could be an issue, but it was. I put in a doctype and it now lays out the same in IE. Any idea why my border radius isn't working correctly in IE. It works when that background is solid color, but when I put gradient, it reverts back to regular corners. check out http://housedogg.com/test/book_reports.php in both IE and FF. Notice the middle box on the left is rounded, but the top and bottom are not. The only difference is the BG is gradient rather than solid. Nav bar does the same thing. Thanks,
Microsoft filters override CSS3 properties... Which is why for IE I wouldn't bother with the filter gradient. Oh noes, IE8 and lower doesn't get gradients... such a deal breaker With so many properties alike there, I'd HIGHLY suggest gutting the CSS for that section down to this: .smallcontainer, .smallcontainter1 { margin:4px 10px; padding:10px; color: #000; border:solid #DDD; border-width:3px 3px 1px 0; border-radius:20px; } .smallcontainer1 { background:#DDC3F3; /* IE and older browsers */ background:-webkit-linear-gradient(top, #6699FF 0%,#eeeeee 100%); background:-moz-linear-gradient(top, #6699FF 0%, #eeeeee 100%); background:-ms-linear-gradient(top, #6699FF 0%,#eeeeee 100%); background:-o-linear-gradient(top, #6699FF 0%,#eeeeee 100%); background:linear-gradient(to bottom, #6699FF 0%,#eeeeee 100%); } Code (markup): No clue why you were floating those individually or setting their width since their parent element should be handling that... You seem to have even more issues now than before -- tags like CENTER which have no business in pages written after 1998, wrong closing tags, the heading orders make even LESS sense with multiple H1, opening H1 but closing H2, H3 with no H1 or H2 preceeding it... Windows-1252 encoding which NO website has ANY business using... With 109 validation errors you do not even have HTML, you have gibberish. That it's 109 errors in a loose/forgiving Tranny document just makes it even worse -- since strict would likely triple that number. If you do get that markup working cross browser, it will likely be out of blind luck and not by design. For example, see how you have doctype more than once, HTML more than once, HEAD more than once? That's not gonna fly.
Thanks for the reply. I noticed my errors went way up and I did see the multiple HTML, HEAD etc and I think that is being caused by the php action "include_once". On the page that I am calling (ex: nav.php), I have <html></html> tags and others. I think that is why they are duplicating. Should I not have doctype, html, head, etc on the nav.php page?
I removed all the html, head, doctype from the page being called and it seems to have gotten rid of a lot of duplicate tags.
PHP includes are glued together EXACTLY as they are written -- where you say 'include' is the exact same thing as typing the contents of that included file RIGHT in that spot. So each 'sub-file' shouldn't have it's own copies of things like the doctype, head, etc... I typically make a 'template.php' that has everything from <BODY> up in one function, and everything in </BODY> down in another -- I can then require_once the file (meaning it won't try to be included more than once) If you look at the example I did a hour or so ago for... oh hey... you... Uhm... You can see how I handle that from the template.phps http://www.cutcodedown.com/for_others/trenttdogg/formToMarkup/template.phps and how the two template_header and template_footer functions are called in the demo. http://www.cutcodedown.com/for_others/trenttdogg/formToMarkup/demo.phps That one is simplified down a bit -- passing the title as a parameter. A more robust system would have a settings handler of some sort (possibly a singleton) to handle passing values around safely/securely... You could also have elements that are the same on every page moved into those functions and build things like the CSS includes, META-data and even the menu from arrays.