Layout issues with FISD 2012 theme

[Brent]

The new theme looks great. Unfortunately I'm having bugs with some of the browsers I'm using, so I hope I can help get some of the kinks worked out. Cross browser style and layout issues are a huge pain, so I'm sorry to have dump these issues on Lucas and our other webmasters.

 

I'm using Internet Explorer 10 in compatibility mode. (Browser Mode: IE 10 Compat View, Document Mode: IE7 Standards). I'm experiences similar layout problems with the Windows Phone 7 browser, which is an IE9 variant, but I can't take screenshots from the device so I'll primarily refer to the desktop experience.

 

There are quite a few quirks right now, so I'm not going to go deep in to the style sheets to try to figure out what's going on unless someone wants me to try doing that. I'm just going to try documenting the most noticeable effects I'm seeing.

 

Title:

 

"Also tagged with" over run:

 

Buttons:

 

Grid alignment:

 

While looking at this I also notice that there are some HTML issues that might be confusing the browser, such as multiple elements with the same id (I think id was used instead of class for the "left active" content).

 

Check out the html for: http://forum.whitear...=0

<div class='desc lighter blend_links'>
  Started by <span itemprop="creator"><a hovercard-ref="member" hovercard-id="2179" class="_hovertrigger url fn name " href='http://forum.whitearmor.net/index.php?showuser=2179' title='View Profile'><span itemprop="name">ZeroRoom</span></a></span>, <span itemprop="dateCreated">Yesterday, 09:23 AM</a>
</div>

 

It appears that there is a mismatch between a span and an anchor near the end <span ...> … </a>

 

Thanks for the work keeping the forum going! Let me know if there is anything I can provide that will help.

[bigironvault]

Yup I get that as well ...

[arbayer2[TK]]

I've noticed that overrun on my copy of FirefoxPortable 11.0, so I'm with you there, the rest I don't seem to be having. It could be the compatiblity mode or IE itself, but I'm not an expert on it. Hope your issues get sorted out, Brent. I wish I could help out a fellow Bothellite.

[TK bondservnt[501st]]

keep those 2011 skins running!

hope we can get this all sorted out!

 

[Brent]

keep those 2011 skins running!

 

Removing the jump-to-unread blue dot was good motivation to move to the 2012 theme . I'm looking forward to everything working well though.

[bigironvault]

Hey guys I'm wanting to revert to the 2011 skins for now. How do I do that? I can't seem to find the option.

[Brent]

In the far lower left there is a "Change Theme" link.

[dashrazor]

Lucas is working at fixing the compatibility issues with IE, Firefox and google chrome are working fine

[Brent]

Lucas is working at fixing the compatibility issues with IE, Firefox and google chrome are working fine

I believe this is the experience of most web developers

[dashrazor]

i dont even like to click on the IE icon on my desktop for testing my malware guard and firewall just go nuts every time lol

[seantrooper[TK]]

Mine is working fine Running firefox.

[ZeroRoom[TK]]

I believe this is the experience of most web developers

 

Your absolutely right Brent - Browser compatibility ain't the challenge that it used to be but that damn IE is the last hold out of the web designers nightmare!

 

 

 

Thanks for posting these. I have no access to Internet Explorer so it's good to see screenshots.

 

That issue with the menu bar was pointed out during testing by RogueTrooper who also uses IE, I thought I had fixed it (it's the IE margin bump thing) but evidently not - back on that then!

 

The overrun on the Also Tagged is a universal problem. I need to apply a different div tag to the header but due to the way IPB breaks up it's code packets I'm having the damnedest time finding the "Also Tagged With" template... Working on it.

 

From the buttons (and the nav bar) It's clear that IE can't recognise CSS gradients or rounded corners. (I was under the impression that had been fixed in 9). In a smart alec (and obviously misdirected) move I changed out all the buttons at the last minute to remove any image links and replace them all with pure CSS to speed load times. That will clearly have to be reverted at least for IE.

 

The horrific alignment issue is a tricky one for me - as I said I don't have any access to IE to check. I'm guessing it's either the margin thing again or a float property. Brent could you see if you can spot the CSS causing this and I'll fix it, That really is the worst of all the bugs.

 

Meanwhile I also have a look at that left active content ID/Class issue and see if that's what has happened.

 

Thanks again Brent - more screenshots for any issues are welcomed!

 

P.S I always forget how horrible fonts look in IE until I see it again. Urgh!

[ZeroRoom[TK]]

There it is! IE 10 supports CSS gradients natively (or will do when it is officially released) 9 does not...

[ZeroRoom[TK]]

OK - this is what the top navigation bar looks like for everyone but IE:

 

 

Clearly it's rendering transparent in IE.

 

I have added a safety that should at least get IE users a solid colour, which is not as nice as the shiny metal look but at least legible.

 

Can someone using IE 7 or above please let me know ASAP if this fix has worked?

[ZeroRoom[TK]]

I have now applied this fix to all buttons. Please let me know after you empty your cache if it works. Screenshots appreciated!

[ZeroRoom[TK]]

"Also Tagged With" overun issue also now fixed.

[Brent]

The grey background seems to have only applied to the main index. It seems unchanged when viewing a topic.

[Brent]

It looks like IP Board is running the css through some sort of minifier. I can see the change you made in the css on the main page:

 

http://forum.whitear.../ipb_common.css

Contains #primary_nav { background-color: rgb(200, 200, 200) }

or something to that effect

http://forum.whitear.../ipb_common.css

does not contain that

 

Some sort of server side css cache preventing the change from coming through?

[Brent]

Hmm. My bad apparently. I'm getting the grey buttons now on all pages. I had to clear my cache several times for some reason.

[ZeroRoom[TK]]

Roger that - you can ignore my cache question in my reply to your PM then!

[LadyInWhite[TK]]

(-A-) I'm assuming/hoping you're working on getting those great EIB and Birthday widgets back up into the right column?

 

(-B-) Birthdays are listed again in the bottom, but only the first 5. How can I view more/all like you can with "who's online?"

 

Neither is a priority, just hoping they're on your radar!

Edited March 26, 2012 by LadyInWhite

[ZeroRoom[TK]]

Yup they're on the radar! If you want to see the full list of birthdays go to the calendar link in the top navigation bar.