involed question

[businessman332211@hotmail.com]

I had a question here but it's hard to explain, by default my main board is phpfreaks. But I am starting to like this one, there is more help here for css/javascript users, than anywhere I have ever seen. Here is my problem but it's hard to explain, So I am going to put down each section of conversation in quotes to give you an idea of why I am askign what I am asking.the website is www.freelancebusinessman.com and originally I was using a hack to fix a problem with internet explorer, but it never worked in opera correctly. I tried it on firefox, netscape. Now what I did was have someone help me, I used his code, and it used a lot less code to get something done. I don't understand what he did to make it less and still work right. The other thing is my code was different and what you see in my stylesheet now, what I had in those sections was replaced in the section.

I have finally broken through from using Absolute and Relative positioning. I dislike wrapping my websites with #wrapper divs. So I came up with other solutions, I encountered a massive problem, a misalignment issue between internet explorer and firefox, I fixed this*Please note the homepage is still under construction, I am still working with link coloring and some other issues.But what I did was implemented a hack, that removed the margin problem in ie, and it looked good in firefox, but there is a major error in opera. I can't get it to get off the logo, no matter what, that is my problemwww.freelancebusinessman.comYou can see my css, and Xhtml code there, everything should validate too, I have been playing with them some, but nothing should have thrown off validation. The last issue I am having is with opera, and I would like to get rid of that hack too if I could but I couldn't find any other solutions.EDITAlso is there any way for me to change around the way I am doing this. I will even redesign the whole thing from scratch, if there is a better way for me to set up this layout, right now as it is, as the content expands the bottom nav bar moves down, as it's supposed to, but I also have incorporated that hack in the css file to fix that, and I am still having the issue severely in opera, the issue comes from margin, on the logo or top of that div, but when I fix it, it severely messes up. The other thing I am trying to figure out, is it possible to create something that looks good in all the browsers I am using being Firefox, internet explorer, netscape, opera- and still have it look good in safari(which I can't see) without using css hacks. Or programming to correct errors, I want to use programming, but not to situate layout I have heard it's bad. I just want to get good at this, I know php, sql, and javascript I will get good at, as I use them, but those are useless to me, unless I am a master of css. I am alread a master almost of Xhtml, but the css, I am still working on and in the past 3 days I have learnt 200 fold from what I previously knew, and I knew a lot then. So I am doing a lot better, getting some of these issues situated will help, I know alot of the stuff I am asking here is subject to opinion, so I am seeking opinions, but anything that can be backed up with proof on accessibility, or standards compliant, would be a push I need to start working in that direction, I want to be 100% hand coded(programming, excetera except when using third party scripts in php), standards compliant, and do as much as possible to keep the code, easy to read, easy to understand, and well commented. If it's possible I would like to do any type of layout, or anything without ever using hacks, and I dug very deep into liquid design I tried my hardest to get liquid design, and I thought I had it until the design was laid out, any advice, or proof, on somethings I can do(if) I redesign my site, to make it 100% liquid I would love it, because when I Finish the homepage completely that's it, I just copy and past the html code, and then redo the content area, and fill it with the new content, I am having the same page layout for every single page, so the homepage is the most critical page on there, sorry for all the writing, but I was hoping to shed some light into the reasoning for me asking these questions, and these number of questions. Thanks for any help, greatly appreciated.MAJOR QUESTION-SHould I follow w3 standards when using selectors or do them my wayw3p#maincontent{}h3#maincontent{}p.maincontent{}h3.maincontent{}ExceteraMY personal preference#maincontent p{}#maincontent h3{}.maincontent p{}.maincontent h3{}Which way is better, the way w3 shows, or my way, if it's w3, then I will go through and change all of it now, and start mastering that way as well.again sorry for all the questions but I really need this help, I am trying my hardest to advance my career, even if I have to redesign 50 times.THanks.

does anyone have any ideas on this opera problem, if I can't find out any other way except to take and use php to detect the browser, and use a different stylesheet for opera, there has to be some other way

You seem to have crap loads of CSS hacks. This is not needed at all.Remove any hacks form your CSS. Now apply the following CSS to your #maincontent stye, basically repolace what ever you have for that style with the following:CODE#maincontent {float: left;width:640px; border-style:double; border-color:#333333;text-indent:1.2em;margin: 0.5em 0 0.5em 0.5em;padding: 0.5em;}Now float your menu (#mainnav) to the left, or just change the CSS to this:CODE#mainnav {width: 200px;background-color: #666666;margin: 0.5em;border-color:#333333;border-style: double;float: left;}By now you should see that Opera, IE and FF are displaying your site correctly! Now for a small finsihing toch to make your site appear centered on screen is to change the body style to the following:CODEbody {background-color:#7A97A5;width: 900px;margin: 0px auto; /* Allows the site to be centered on the screen, rather than being stuck to left of the window */}Your site should be cross browser compatible Opera, FF, IE (6 and 7) and hopefully others such as safari) with no CSS hacks insight!

The thing that confuses me, I thought I was only using one hack, I hadn't intentionally tried to use any other hacks, that is what confused me.

Alot of css hacks?? I am confused, I thought I only had one hack in there, the one to fix internet explorer, but monday when I start to work again, I will look at your code, and apply it to my site, then dissect it to find out what you did to make it work. I have learnt 100 times what I new before In just the past 3 days, doing what you said, when I encounter a problem I run through bunches of websites, looking at there css file. I will remove that hack, but I am pretty sure, that I only have one hack in there.

Below is a copy of all the questions I actually wanted to ask here, because I know I won't get an answer at the other place.

Ok, I looked over your stuff wildteen today. I was looking over this, and I changed everything but I didn't want to without understanding it, again I am trying to master css. I understand now what you showed me about the body, what I had was the body was set with margin's and padding earlier, now I see you set the body with a width, and margin and that centered it, to tell you the truth I was unaware that you could set a width for the body. But I see it's set and looks exactly the same with less code, the question about that which is technically better, setting the margin and padding of the body, or setting the width of it, then adjusting the position.Another thing I didn't understand what happened with the main navigation and the content area. I floated one left, into another one, and did a few other things.What I don't get fully is the way what I had, changed to what you had and still worked. I redid it the way you said, I don't fully understand it enough to be able to do it the same way next time I build a layout, so if you have time could you explain that too me as much as you can, so I understand better. You also dropped a couple of my border styles and somehow my border still turned out the same.And how on earth didmargin: 0px auto; /* Allows the site to be centered on the screen, rather than being stuck to left of the window */set my entire body to be in the center, I prefer doing it this way so I redid that part to look likebody {background-color:#7A97A5;width: 900px;margin-top: 0px;margin:auto; /* Allows the site to be centered on the screen, rather than being stuck to left of the window */}and what I don't get is, the margin-top I know removed the margin at the top. The auto, I am confused about, as soon as I set margin auto for the rest, it centered it, how does that happen. Does that mean by default when the left and right margins are auto then they set it into the center.Sorry for all the questions, but any help would be greatly appreciated.And the only thing, is it still doesn't work in opera, it doesn't even close the area between the logo, and the top. Is there a way to fix it in opera, thanks for all the help so far I greatly appreciate it.

Well the bottom one is a list of the questions I need help on, I apologize for the long post, but I had no choice to get the general idea down of what was going on, or the questions would have made absolutely no sense, and the way I am, a lot of my posts will be huge, thanks for the help, to anyone that is able to answer any of those questions in the last quotes.

[boen_robot]

Yup. A really long post and I must say I'm not going to read all of it. Let me just suggest a general idea which I think I mentioned before, but anyway...Try isolating the IE issues in their own stylesheet. Then call the stylesheet with a conditional comment like this:

<!--[if lte IE 6]><link rel="stylesheet" media="all" type="text/css" href="iestyle.css" /><![endif]-->

That way, you'll be clear to make your site work in Opera and Firefox, which should be relatively easy, scince you won't take the buggy IE into consideration.

[businessman332211@hotmail.com]

Also I was thinking about that, but I was suggested on multiple encounters to don't get into a habit of that, or it will require a lot of maintenance, but instead leave it as a last resort, when it's for a client, and there's a strict deadline.