[Webkit-unassigned] [Bug 115248] [CSSRegions] Min/max-width should support values other than length

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=115248





--- Comment #7 from Chris <chris.jones-gill at kisswebdesign.co.uk>  2013-07-10 06:27:06 PST ---
I have created a simple fiddle here: http://jsfiddle.net/chrisjg/q7nhQ/

example HTML

<nav role="navigation">
    <ul class="nav menu">
        <li class="item-1">short</li>
        <li class="item-2">a bit longer</li>
        <li class="item-3">this is a lot longer</li>
        <li class="item-4">short</li>
    </ul>
</nav>
-----------------

example CSS

nav {
    font-size: 16px;
    letter-spacing: -0.5px;
    list-style: none outside none;
}
.nav, nav ul {
    display: table;
    margin: 0;
    width: 100%;
}
.nav {
    float: left;
    left: 0;
    position: relative;
    list-style: none outside none;
    margin-bottom: 1.42857rem;
    margin-left: 0;
    width: 400px;
}

li {
    border: 1px solid black;
    display: table-cell;
    height: 34px;
    min-width: 25%;
    text-align: center;
    vertical-align: middle;
}

-------
The important bits are
.nav display: table;
li display: table-cell;
li min-width: 25%;

It should result in 4 equally sized boxes, 
as in the firefox screenshot I have attached. But in chrome it auto-sizes each box to fit the content - as in the chrome screenshot I also attached.

Hope this helps.

Chris.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.