CSS Headaches
Hey guys,
I'm in the process of coding my own website, partially as a way to show my work off in a dedicated environment, but even more so as a test of what I can do.
I've learnt all I know about HTML/CSS & PHP/MySQL by reading online articles, tutorials and resources, which is all well and good but it gets very difficult when you have a specific question about the way your code is working.
Anyway my problem is, I have a pseudo-drop down menu for navigation throughout different galleries on my website, however, while it displays how is should in Firefox, in IE it's (naturally) different, due to browser defaults, but in Chrome. it works in a completely different and totall undesirable way.
My other problem is I recently downloaded Firefox 4.0b11 and now my mouse-over gallery display is also glitching up (but only in 4.0b11 to my knowledge.
Could someone take a look at my site (specifically the areas I mentioned here), and see if they can offer any explanations or work arounds?
Eventually I want to make the galleries display and then hide onClick, but I'm going to wait until I have the time to teach myself enough aout Javascript to manage it.
Thank you
Nick
Website: www.tobeconfirmed.net
I'm in the process of coding my own website, partially as a way to show my work off in a dedicated environment, but even more so as a test of what I can do.
I've learnt all I know about HTML/CSS & PHP/MySQL by reading online articles, tutorials and resources, which is all well and good but it gets very difficult when you have a specific question about the way your code is working.
Anyway my problem is, I have a pseudo-drop down menu for navigation throughout different galleries on my website, however, while it displays how is should in Firefox, in IE it's (naturally) different, due to browser defaults, but in Chrome. it works in a completely different and totall undesirable way.
My other problem is I recently downloaded Firefox 4.0b11 and now my mouse-over gallery display is also glitching up (but only in 4.0b11 to my knowledge.
Could someone take a look at my site (specifically the areas I mentioned here), and see if they can offer any explanations or work arounds?
Eventually I want to make the galleries display and then hide onClick, but I'm going to wait until I have the time to teach myself enough aout Javascript to manage it.
Thank you
Nick
Website: www.tobeconfirmed.net
Comments2
Join the community to add your comment. Already a deviant? Log In
With floating menus, I tend to use what I call "anchor" tags. That is, your "object" tag could be 1px wide, 1px high and float left. You would set the UL tag inside the object to position: absolute and then use margins to relatively move it into the correct position. So it might be (using completely made up numbers):
#dropdown > object { width: 1px; height: 1px; float: left; }
#dropdown > object > ul { position: absolute; margin-left: -50px; margin-top: 20px; }
This makes the floating menus more predictable between browsers because the 1x1 "anchor" tag is in a predictable place. I hope that makes sense. This technique is a lot more important if you have lots of menus within menus and you don't know how big they will be etc.
#dropdown > object { width: 1px; height: 1px; float: left; }
#dropdown > object > ul { position: absolute; margin-left: -50px; margin-top: 20px; }
This makes the floating menus more predictable between browsers because the 1x1 "anchor" tag is in a predictable place. I hope that makes sense. This technique is a lot more important if you have lots of menus within menus and you don't know how big they will be etc.