CSS的未知Z-Index问题

Question

我有以下CSS处理元素：

               .box {
                width: 400px;
                height: 60px;
                -moz-border-radius: 30px;
                -webkit-border-radius: 30px;
                border-radius: 30px;
                -moz-background-clip: padding;
                -webkit-background-clip: padding-box;
                background-clip: padding-box;
                -moz-box-shadow: 0 1px 3px rgba(0,0,0,.3);
                -webkit-box-shadow: 0 1px 3px rgba(0,0,0,.3);
                box-shadow: 0 1px 3px rgba(0,0,0,.3);
                background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDQwMCA2MCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+PGxpbmVhckdyYWRpZW50IGlkPSJoYXQwIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjUwJSIgeTE9IjEwMCUiIHgyPSI1MCUiIHkyPSItMS40MjEwODU0NzE1MjAyZS0xNCUiPgo8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGZkZmRmIiBzdG9wLW9wYWNpdHk9IjEiLz4KPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZTllOWU5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgPC9saW5lYXJHcmFkaWVudD4KCjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSI0MDAiIGhlaWdodD0iNjAiIGZpbGw9InVybCgjaGF0MCkiIC8+Cjwvc3ZnPg==);
                background-image: -moz-linear-gradient(90deg, #dfdfdf 0%, #e9e9e9 100%);
                background-image: -o-linear-gradient(90deg, #dfdfdf 0%, #e9e9e9 100%);
                background-image: -webkit-linear-gradient(90deg, #dfdfdf 0%, #e9e9e9 100%);
                background-image: linear-gradient(90deg, #dfdfdf 0%, #e9e9e9 100%);
                position: relative;
                top: 100px;
                display: table-cell;
                vertical-align: middle;
                text-align: center;
            }

无论出于何种原因，这隐藏了一个元素。它背后的元素应该具有高z指数。我无法确定哪个CSS属性可能会导致此元素具有高z = index。

和想法？

如果有人想知道，隐藏的元素是Primeface的Dock。