Really, I do. I’m not the best coder by any means but I try very hard and hand coding my own websites and they come out alright. Until I switch to Internet Explorer, that is. Coding is difficult enough without having to cater for cross browser compatibility. The first issue is how differently Internet Explorer and Firefox translate pixels, margins and padding and often means a three column layout can look perfect in FF but IE decides to push a column or two to the bottom of the screen simply because it’s 1 pixel too big. This isn’t too bad to resolve; playing around with the numbers usually solves it.
A brilliant solution is the reset css which I found at just searching, which strips out all margins or whatever else the browsers automatically add. For example, the <p> and <h1> tags automatically have quite a significant line-height automatically given to them which can affect the lining up of <div>s. The reset css puts both browsers on a level playing field and gives you complete control of every attribute.
But even with this reset css applied, I noticed a list still had indentation in Internet Explorer which made a navigation sidebar on one of my sites look really strange. The <ul> and <li> tags had no margin, no list-style-type, nothing so why was it doing this? Apparently IE needs a float:left added to the list to really force it to the left. Irritating, but solvable.
But now I’ve come across yet another strange browser compatibility issue - colour! Do browsers translate colours differently? Take a look at this site (under very heavy construction, so watch out for falling code and broken links). In FF, the background-colour of the header image and the div around it is identical but in Internet Explorer, it looks slightly different. Is it just me? Makes me think I should just give up coding and spend the time writing content using Blogger or something like Lee. Or I should drive a car through the front windows of Internet Explorer HQ in a frustrated, sadistic rage.
Tags: Browser, Firefox, Internet Explorer
Posted in Coding, Design, Tips and Tricks | 3 Comments »
<rant>
Here I am at 5am and I feel like screaming from the rooftops with joy. I finally located the </div> that has been messing up my code and causing me nothing but frustration and anger for the past half hour.
I’m no expert coding whizz but I love designing and coding my own sites. I’m easily bored and have a redesign more often than I have Sunday dinners, something which I’m going to stop doing if I actually want to start getting traffic and money! I’m self taught in HTML, CSS and bits of PHP learning from tutorials on the web, e-books and lots of trial and error fun. But it’s frustrating as hell.
My biggest peeve is Internet Explorer. I can spend a few hours lovingly coding a site and previewing it in my browser of choice, Firefox, where it looks perfect. I switch to Internet Explorer and suddenly my site has chunks missing, features overlapping and whatever else IE decides to break my site with. This very site is a perfect example; the sidebar looks fine in Firefox but IE prefers to insert a chasm of space between each link. I think I’ve finally worked out that the issue is down to the line-height property.
Tonight I’ve been working on what will eventually be my biggest site and I’m sick of serving the minorities. I try and keep my sites to an 800px frame for those that still use the ridiculously magnified resolution but the site I’m working on requires three good sized columns and that won’t happen in an 800px frame. I’m going to make it relatively liquid, but if Amazon don’t keep to an 800px frame (go to Amazon, switch your display to 800px and notice the scrollbar at the bottom of the window), there should be little issue.
This site has more <div>s than I care to mention, and WordPress likes to throw in a few unnecessary (in my opinion) <div>s for extra measure. I make one small change, the sidebar disappears and I have to spend the next half hour counting how many <div>s are actually closed, checking sizes, margins, padding and all that malarkey. Perhaps I’m stupid, perhaps I put too much work into it but in the end I come out victorious. I have a nice three column site that works and now needs many more hours to put in content and optimise for SEO….
</rant>
Posted in C'est Moi, Coding, Design | Post a comment »
Wednesday, February 13th, 2008 
Coding, Design, Tips and Tricks 
3 Comments »
