[CSS] Problem z display table cell Opcje

[prototype]

Mam taki o to problem, ze nie chce mi to dzialac poprawnie, chodzi mi o taki uklad:

|xxxxxxxxxx|
|yyyyyy|zzzz|

Czy ktos ma pomysl co jest tu zle?:

[HTML] pobierz, plaintext 
<div style="width: 500px;">
    <div style="width: 100%; display: table; table-layout: fixed;">
        <div style="display: table-row; width: 100%;">
            <div style="display: table-cell; vertical-align: top; background: lime; width: 100%;">
                x
            </div>
        </div>
        <div style="display: table-row; width: 100%;">
            <div style="display: table-cell; vertical-align: top; background: red; width: 66.2%;">
            y
            </div>
            <div style="display: table-cell; vertical-align: top; background: yellow; width: 33.33%;">
                z
            </div>
        </div>
    </div>
</div>
[HTML] pobierz, plaintext 

https://jsfiddle.net/4jowofeg/