This is my first post, and I'm excited to have just joined this community!
I'm jumping ship from IT/SysAdmin to work for myself and do do web design/development. I need to unleash my creative juices!
I'm looking forward to learning a lot and helping as much as I can as my knowledge grows!
-- Alright, here's my issue. I'm very new at doing this and my first project is an in-kind website for a charity ball in one month's time. I've begun laying it out using what I know of CSS and HTML (having only copied some parts of the nav menu's CSS). In Chrome, the website looks like I want it to! In IE, Safari, and Firefox, my floated elements are not in the right spots! Also - I made a 3 column layout and that also moves from where I want it to be, except in Chrome.
Should I use the position attributes instead of floating these elements?
Hopefully, I'm not asking too much for anyone to give me some sound advice of how to remedy this problem and I can apply it to all future websites as well! I've tried to layout the website cleanly and organized. I've completed Lynda.com's HTML and CSS tutorials. Nothing like real-world experience, though!
I don't have anything to offer, but I can +1 your replies, or however this forum works! haha - All help is greatly appreciated!
I've spent 10 hours so far on building the site, but that includes the graphics. I apologize if my answer is found in another article. I'm going to bed now - and as I'm still new - I imagine a response would be quicker than me browsing article after article and trying multiple things to fix my problem.
The website is at: http://www.niagaramasquerade.com/Untitled-2.html
Thank you so much everyone! - Aaron Zitello
you have to put browser
you have to put browser compatibility code in your page than it should be run properly..
Hi azitello, I have checked
Hi azitello,
I have checked your website on Chrome, Firefox and Internet Explorer.
But the only things that seem off are the "visit us on Facebook" image in the header and the ping "niagara life logo".
Here is how we fix the facebook image, go to site-style.css on line 112 and fine the following lines:
#facebook_go { margin-top: -36px; margin-left: 24px; }
and change it to:
#facebook_go { margin-top: -36px; margin-left: 24px; float: left; }
now for the pink image, go to site-style.css on line 105 and fine the following lines:
#nlc_logo { height: 115px; width: 257px; margin-left: auto; margin-top: -110px; margin-right: 5px; }
and change it to:
#nlc_logo { height: 115px; width: 257px; margin-left: auto; margin-top: -110px; margin-right: 25px; }
As you can see I altered the margin-right to 25 pixels.
Now it should correctly on all browsers.
If not, please contact us again.
@jamesmoore
Absolutely not. No new document needs that work-around. It is meant for older documents, written for MSFT's highly non-compliant browsers, i.e. IE<9. Basically, it's so you can tell new, good IE versions to act as if they were stupid.
cheers,
gary