Inconsistent Markup

Anonymous

#19252

Hey Ross,

I know support is going to be limited this week, but hopefully this is something small that I’m doing wrong. I’m using a Dropdown Filter (Combobox) and everything is working great except when I view my website in IE9. The styles are missing, and everything looks different. I’m using BrowserStack to test the site, so I opened up Firebug Lite and noticed the markup was a bit different. The <form> tag is inside of a <p> tag, so the rest of my inputs aren’t directly nested under the form so none of my styles are being picked up.

Here are some screenshots:

Do you know why this would be happening? Is there something I can do to fix this?

Thanks!

Ross Moderator

#19264

Hi Drew

Its certainly strange whats happening, possibly another plugin, or some scripts that aid in compatibility with older versions of IE?

The first bit of html Search & Filter outputs is the opening <form> tag – so I’m fairly sure if there is an erronous <p> being added that its not by S&F.

I guess its possibly some html tags in your document are not closed properly and causing inconsistent behaviour across browsers (in this case just IE9). Have you run your html through a validator? What happens when you actually view the source of the page rather than DOM inspect, on both IE9 and a modern browser?

Hope that helps

Anonymous

#19275

It’s very strange. I disabled all plugins. Removed my custom scripts. Removed my custom styles. This is still happening in IE 9 only. Everything looks normal in IE 10.

All tags seem to be closed, there are no issues with the page markup. What I thought was interesting is when I view the source in IE 9, it appears to be normal. No random paragraph tags, everything is nested as it should be.

I’m not too sure what else to try. This is pretty bizarre. Any other ideas?

Thanks a lot.

Anonymous

#19277

I figured it out. I had to wrap my shortcodes in a div tag.

<div>
[searchandfilter id="348"]
[searchandfilter id="348" show="results"]
</div>

Without it, WordPress was adding some <p> tags that had some inconsistent behavior.

Thanks!!

Ross Moderator

#19304

Great stuff 🙂

[Author]

Posts