CSS flex Property

[Digital Jedi]

So here's my problem, layed out:

• I'm trying to target all modern browsers and IE 10 and up.
  .
• [minicode]display: flex[/minicode] will work in Chrome, presumably Firefox, and IE 11.
  .
• However, IE 10 requires the vendor prefix [minicode]display: -ms-flexbox[/minicode].
  .
• IE 10 dropped support for IE conditionals.

And thus, my problem. How to target IE 10 specifically.

So far, nothing I've researched works for me.

I don't want to use floating divs. Because I hate floating divs. I want to strangle floating divs in their sleep. So it's best I stay away.

--------------- Added [DATE]1383116784[/DATE] at [TIME]1383116784[/TIME] ---------------

Okay, apparently it's just me having this problem. Because I've always set multiple display properties in the same class and never had any problems. Turns out I'm doing it the way I'm supposed to do it, but it's not working inside vBulletin, for whatever reason:

.djsNavbar {
 	display:-ms-flexbox;
	display:flex;
	text-align:center;
	list-style:none;
	margin:0;
	padding: 0px; /*Removes extra padding in the front of blocks on webkit browsers*/
	background:#274279;
	}

.djsMenu_control {
	-ms-flex-order:1;
	flex:1 1 100%;
	padding:0px;
	border-right:1px solid black;
	border-top:1px solid #587C8A;
	border-left:1px solid #587C8A;
	text-transform:lowercase;
	letter-spacing:3px;
	}

Ends up doing nothing in IE 10.

However, testing it in a plain HTML document and it works the way it's supposed to. I'm lost. Note that I am inserting this CSS code via a template and plugin.

--------------- Added [DATE]1383117295[/DATE] at [TIME]1383117295[/TIME] ---------------

From now on when I'm stuck on a problem, I'm just going to start a thread right away on it, so the problem solves itself the minute I hit Post. My problem was a little thing called browser caching. Ever hear of it?


<stupid IE>