是否有可能在CSS中执行这样的条件

Question

Let's say I have a CSS DIV that holds formatted syntax code. The DIV is set to a min-width:100; and a max-width:100;

This same DIV has another CSS declaration for when the DIV is Hovered, max-width: 135% !important; and min-width: 135%;

So if the DIV holding the formated code is wider then the DIV's width, it shows a scroll bar and when you hover over the DIV it expands the DIV to the width of the code not to exceed 135%, if the DIV's code does not exceed the width of the DIV then the DIV stays the same width.

My problem, is that when a div exceeds the 100% width, it expands to the width of the code inside but stays LESS then 135%, is there a way to make it expand to 135% even if the code is not 135% but is over 100%?

Hopefully this makes sense

I almost need some kind of conditional statement that says...

---

If DIV contents are > 100% then make DIV 135% on Hover otherwise leave DIV at 100%

---

Is this even possible?

Here is my full CSS

.syntax {
  min-width: 100%;
  max-width: 100%;
  margin: 1em 0 1em 0;
  position: relative;
  overflow-y: hidden;
  overflow-x: auto;
  font-size: .9em;
  display:inline-block;
}
.syntax:hover {
  max-width: 135% !important;
  min-width: 135%;
}

Answer 1

I'm not sure I'm getting waht you mean, but if I'm not mistaken, all you're leaving aside is this:

min-width: 135% !important;

you may need to adjust overflow depending on what you need

A better option would be to use fixed sizes, but if you're working on adaptive layout environments guess that is a no go