造型 - 消除North&中心（Primefaces） [英] styling - removing gap between North & Center (Primefaces)

问题描述

我试图消除North和Center布局之间存在的缓冲区或resizer。我用fullPage = true b / c我喜欢它自动调整大小。从屏幕边缘到内容主体的边框设置为颜色，我通过将主体背景设置为颜色并将北部和中心布局设置为白色来实现此目的。问题是背景的颜色是通过分隔北面和中心来显示的。我使用了firefox / firebug，并注意到这里有一个缩放器，我可以用这行删除：

I'm trying to eliminate the buffer or "resizer" that exists between the North and Center layout. I have used fullPage=true b/c I like that it auto resizes. The border from the edge of the screen to the main body of content is set to a color and I accomplished this by setting the body background to the color and I the north and center layouts white. The problem is that the color of the background shows through separating the north and center. I used firefox/firebug and noticed that there is a resizer there that I can remove with this line:

.ui-layout-resizer, .ui-layout-resizer-north, ui-layout-resizer-open, .ui-layout-resizer-north-open 
{
    height: 0px !important;
}

不幸的是，Primefaces仍然将中心布局[我怀疑]认为resizer已经消失了。结果是作为一个部门显示的背景颜色。我已经尝试设置中心来定位相对和高度为-6px无效。我承认，我不是最先进的CSS，但任何人都可以建议我如何实现从北到中间没有任何间隙的无缝过渡。我曾尝试将填充/边框/边距设置为0，但检查萤火虫后的问题似乎是北部以南6px的中心区域的绝对位置，因此即使我删除了布局调整板也有空间存在。

Unfortunately Primefaces still places the center layout [I suspect] 6 px below north even thought the resizer is gone. The result is the background color showing through as a division. I have tried setting center to position relative and height to -6px to no effect. I admit, I'm not the most advanced with CSS but can anyone suggest how I can make a seamless transition with no gap from North to Center. I have tried messing with padding/border/margins to 0 but the issue after examing firebug appears to be the absolute placement of the "center" region 6px south of north so that the layout resizer has room to exist even though I deleted it.

解决方法是将所有内容放在中心，并且不要使用North，但我不知道这是否是糟糕的设计。

The workaround is to put everything in the Center and do away with North but I don't know if this is bad design.

推荐答案

我对jquery没有真正的经验，但是这似乎对我有用（使用primefaces扩展）：

I'm not really experienced with jquery but this seems to work for me (with primefaces extensions):

<script type="text/javascript">
                 var layoutSettingsAll = {
                     name: "layoutSettings"
                     , north: {
                         spacing_open: 0
                         , spacing_closed: 0
                     }
                 }
                 $(document).ready(function() {
                     layoutSettings = $("body").layout(layoutSettingsAll);
                 });
            </script>

这篇关于造型 - 消除North&中心（Primefaces）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！