CSS Gurus

[RazorSharpe]

Any CSS gurus out there that have a few minutes to chat on ICQ? I'm having a dreadful time with what should be a trivial CSS element and I've spent about 3 hours in firebug and for the life of me, i don't know what I'm doing wrong. Maybe it's a lack of sleep or maybe I'm just stupid

In any case, if you have a few minutes to spare, please message me on 125-48-32-18

Cheers ...

[RazorSharpe]

No CSS gurus online that care to pit themselves against a problem? I thought for sure I'd have a few takers. Where is potter when you need him?

...

[barcodes]

Maybe post the snippet of code you are having an issue with here and explain what you are trying to do? Maybe the ones on don't want to get on icq right now.

Either way, best of luck with it.

[VladS]

Sure, drop a line -> 360 125 375

[grumpy]

show some code and we can help

[V_RocKs]

Always easier and faster to post code... Then a description of what you are trying to accomplish...

[RazorSharpe]

Always easier and faster to post code... Then a description of what you are trying to accomplish...

Funny you should say that because I find it is always easier to see the site so I can get a better idea of what is being asked rather than snippets of code. Sometimes code just isn't enough to explain the issue, especially with a design that is very involved and not just "how do I put a border around this" .... this is one of those involved designs unfortunately.

Cheers though lads - and GSX, I'll message you in a minute mate.

[VladS]

[...] Cheers though lads - and GSX, I'll message you in a minute mate.

I'm not at the office right now, i'll catch you on Monday.

[RazorSharpe]

I'm not at the office right now, i'll catch you on Monday.

No worries Gsx - had a nice chap off GFY (thanks moe) try and help but unfortunately it's still not figured out. Anyone else care to take a stab at it?

[VladS]

No worries Gsx - had a nice chap off GFY (thanks moe) try and help but unfortunately it's still not figured out. Anyone else care to take a stab at it?

Do drop a line if you don't solve it by tomorrow, am really curious now as to what's the big problem with it, heh.

[RazorSharpe]

Hi Gsx,

sent you an add request.

[VladS]

Hi Gsx,

sent you an add request.

Have not received anything, can you try again - 360125375.

[RazorSharpe]

Have not received anything, can you try again - 360125375.

added you again mate

[RazorSharpe]

Thanks for the chat Gsx! I promise I won't spend much more time on this issue; and I'll follow your suggestion about stackoverflow. Cheers

[VladS]

Thanks for the chat Gsx! I promise I won't spend much more time on this issue; and I'll follow your suggestion about stackoverflow. Cheers

No problems and as stated, if you don't solve it by tomorrow, email me the FTP info.

For the rest of the people, i've taken a look via firebug and suggested he adds a defined width to a div, that fixed the problem on all browsers for me, however he uses IE9 and it seems in there the problem is not solved. I don't have IE9 here, so can't track that down.

[firequartz]

[QUOTE= ... that fixed the problem on all browsers for me, however he uses IE9 and it seems in there the problem is not solved. I don't have IE9 here, so can't track that down.[/QUOTE]

... which is why all my sites contain the following footnote ..

Does this page look "off" to you? For best viewing, we recommend the following internet web browsers:
Firefox - for Windows, MacOS X, and Linux systems.
Google Chrome - for Windows, MacOS X, and Linux systems.
Apple Safari - for MacOS X and Windows systems.

In my book, anyone who still uses IE deserves what they get. I do try to get everything as compatible as possible, but I no longer kill myself for IE.

[RazorSharpe]

... which is why all my sites contain the following footnote ..

Does this page look "off" to you? For best viewing, we recommend the following internet web browsers:
Firefox - for Windows, MacOS X, and Linux systems.
Google Chrome - for Windows, MacOS X, and Linux systems.
Apple Safari - for MacOS X and Windows systems.

In my book, anyone who still uses IE deserves what they get. I do try to get everything as compatible as possible, but I no longer kill myself for IE.

I'm sorry but I don't buy this line of reasoning. Making things work in the 3 most popular browsers isn't normally such a hassle and there is always a work around available that will help you achieve what you set out to. In my case, I knew of a specific work around and Gsx confirmed my thinking but I'm just not entirely satisfied that I haven't done something wrong that is causing this issue which is why I am looking for a more suitable fix rather than a hack.

If you feel comfortable forcing users to change browsers because you couldn't be bothered to find a way to make things work then that's fine. Me, I'd rather find a solution to my problem.

[KillerK]

... which is why all my sites contain the following footnote ..

Does this page look "off" to you? For best viewing, we recommend the following internet web browsers:
Firefox - for Windows, MacOS X, and Linux systems.
Google Chrome - for Windows, MacOS X, and Linux systems.
Apple Safari - for MacOS X and Windows systems.

In my book, anyone who still uses IE deserves what they get. I do try to get everything as compatible as possible, but I no longer kill myself for IE.

Your book leaves lots of money on the table, as IE users buy better in my experience than firefox and then chrome users.

[bean-aid]

Your book leaves lots of money on the table, as IE users buy better in my experience than firefox and then chrome users.

Firefox 34.3 %
MS Internet Explorer 30.5 %
Google Chrome 12.4 %
Safari 8.4 %

Just 1 example of percentages on 1 site

[RazorSharpe]

Firefox 34.3 %
MS Internet Explorer 30.5 %
Google Chrome 12.4 %
Safari 8.4 %

Just 1 example of percentages on 1 site

Yes and on a techie site you'll probably find Konqueror or worse yet Lynx, my point is you design for the vast majority of your users and even in your case IE accounts for more than a third of your traffic.

I can't believe we're still having these conversations in 2012!!

[CyberHustler]

Oh me too me too... here's % of one of my sites

MS Internet Explorer 23.3 %
Android browser 18.1 %
Firefox 16.4 %
Google Chrome 16.2 %
Safari 14.5 %
Opera 3.3 %
LG (PDA/Phone browser) 1.6 %
Unknown 1.5%
Mozilla 1.4%
Samsung (PDA/Phone browser 1.3%
Others 1.9%

[bean-aid]

Yes and on a techie site you'll probably find Konqueror or worse yet Lynx, my point is you design for the vast majority of your users and even in your case IE accounts for more than a third of your traffic.

I can't believe we're still having these conversations in 2012!!

Here is an example of browsers on a mainstream site:

MS Internet Explorer 64.9 %
Firefox 17.5 %
Google Chrome 12.5 %
Safari 3.7 %

[RazorSharpe]

Here is an example of browsers on a mainstream site:

MS Internet Explorer 64.9 %
Firefox 17.5 %
Google Chrome 12.5 %
Safari 3.7 %

Ok, I'm not the one saying we should give up on IE
I am suggesting you design for all the major browsers so in your case IE, FF and Chrome. I guess this would be the same for most sites though.

[HomerSimpson]

firebug is crap...
google chrome rocks in debugging css and stufff...

contact me it's still not solved...

[bean-aid]

... In my book, anyone who still uses IE deserves what they get. I do try to get everything as compatible as possible, but I no longer kill myself for IE.

Ok, I'm not the one saying we should give up on IE
I am suggesting you design for all the major browsers so in your case IE, FF and Chrome. I guess this would be the same for most sites though.

I know... it was a response to the quote above yours.

[RazorSharpe]

I know... it was a response to the quote above yours.

Ah, ok Got my wires crossed there!

[firequartz]

Like I said ... I endeavor to make sure all browsers render my sites well .. and last I checked none of my sites have a problem with the most recent versions of IE (8+ for sure .. I'm pretty sure 7 too .. haven't gotten any eMails about it anyway).

I'm just not a fan of letting the tail wag the dog. It gets to a point where the extra hassle just isn't worth it.

My theory is if you're not willing to update a free browser, I'm guessing you're not about to go into your wallet for anything I'm promoting. If nothing else, it probably cuts down on freeloader traffic. Well .. it's a theory anyway ...

[RazorSharpe]

Like I said ... I endeavor to make sure all browsers render my sites well .. and last I checked none of my sites have a problem with the most recent versions of IE (8+ for sure .. I'm pretty sure 7 too .. haven't gotten any eMails about it anyway).

I'm just not a fan of letting the tail wag the dog. It gets to a point where the extra hassle just isn't worth it.

My theory is if you're not willing to update a free browser, I'm guessing you're not about to go into your wallet for anything I'm promoting. If nothing else, it probably cuts down on freeloader traffic. Well .. it's a theory anyway ...

Any by the same token bona fide paying customers will say, "If this guy isn't willing to make the effort to make his site work on the browser I use, I'll spend my money elsewhere".

Why make people work even harder to pay you for your sites when you can spend a little extra time and make it easier for them?

[firequartz]

Again .. we're pretty much talking theory here. To my knowledge and at last check .. my sites render properly with "the big four" ... (last three versions of each anyway) ... but I think we do a potential disservice by making sites "too backward compatible" ... users should be encouraged to keep their systems as current as possible .. especially when it doesn't cost them anything. It's better for them .. and better for us in terms of the level of sophisticated experiences we can provide.

And if looking at naked people being sexy (or nasty) isn't motivation enough .. hell .. what is?

[RazorSharpe]

Again .. we're pretty much talking theory here. To my knowledge and at last check .. my sites render properly with "the big four" ... (last three versions of each anyway) ... but I think we do a potential disservice by making sites "too backward compatible" ... users should be encouraged to keep their systems as current as possible .. especially when it doesn't cost them anything. It's better for them .. and better for us in terms of the level of sophisticated experiences we can provide.

And if looking at naked people being sexy (or nasty) isn't motivation enough .. hell .. what is?

This is probably why you haven't been making sense to me. My issue isn't backwards compatibility but the issue in question is manifesting itself in the latest versions of FF and IE. I am not aiming for backwards compatibility at this stage but I will settle for it working like it should in current browser versions

[firequartz]

oh ... that's different ... nevermind

Okay .. now you've got me curious ... can you PM me the url or code .. just because I may be philosophically against something doesn't mean I can't do it.

[barcodes]

If it isn't working in 9 gotta make a redirect for 9 or less and modify the code.
Im sure you guys already know that, just throwing it out there anyway.

this may help you guys as far as viewing the problem on an older browser.
http://browsershots.org/

Best of luck

[barcodes]

http://css-tricks.com/how-to-create-...ly-stylesheet/

[RazorSharpe]

oh ... that's different ... nevermind

Okay .. now you've got me curious ... can you PM me the url or code .. just because I may be philosophically against something doesn't mean I can't do it.

If it isn't working in 9 gotta make a redirect for 9 or less and modify the code.
Im sure you guys already know that, just throwing it out there anyway.

this may help you guys as far as viewing the problem on an older browser.
http://browsershots.org/

Best of luck

Didn't want to post the site name on GFY since it's mainstream so I'll do the next best thing and post the issue via a txt file.

http://cdnetworx.com/cssissue.txt

All the info required is in there - I'll try any reasonable fix bar ones that require me to make core changes to plugins since this gets very difficult to maintain with upgrades.

I'm sure a few of you will pick up on this so I'll put it out there from the get go. In these sub menus we have 2 floated columns. Now in order for floated columns to display side by side, the container they are inside of must have a width that can accommodate them or the float will drop (as it should) and this is what is happening in IE and FF. If you remove this snippet of code:
#megaMenu ul li#menu-item-225 {
position:relative !important;
}

You'll see that the columns render correctly but there is no alignment. If the container isn't big enough when I have it position relative it shouldn't be big enough when position relative is removed (but it seems to be). This baffles me. It displays the same in all browsers when position relative is removed.

Have at it lads, time for me to go to bed but I will try all suggestions when I crawl out of bed in the morning.

Cheers ...

[firequartz]

Actually I'm seeing an issue in all browsers with the "Shop by Brands" and "Watches" menu not lining up correctly at all .. in addition to the "Jewellery for Him" menu issues in FF/IE ..

May have to stew on this a while.

[firequartz]

After a little sleep .. looked at your code a bit more. It seems you've figured it out, that is, IE (and surprisingly FF) may actually require the width parameter .. I've run across similar issues on other projects .. it's not really a hack .. just the way the browser was designed to parse CSS.