Html 调整窗口大小时，Div不会向左浮动

您好，我知道有些人对此有问题，以前也问过，但我尝试了所有答案，但都不起作用

我的问题 我有一个div，它有一个css命令floatright。面板位于右侧，但由于某些原因，当窗口大小调整到一定大小时，div向下移动

如何解决此问题。

<p:panel class="MembersPanel" >
        <f:facet name="header">
            <p>
           Psst Members over here!
            </p>
        </f:facet>
    </p:panel>

代码。

<p:panel class="MembersPanel" >
        <f:facet name="header">
            <p>
           Psst Members over here!
            </p>
        </f:facet>
    </p:panel>

图片示例。

<p:panel class="MembersPanel" >
        <f:facet name="header">
            <p>
           Psst Members over here!
            </p>
        </f:facet>
    </p:panel>

示例：1

这是常规尺寸的面板。（窗口为100%）

示例：2

窗户一侧正在缩小。请注意，右侧的面板也在缩小。我想要那个

示例：3

这就是我的问题所在。 当窗口缩小到一定大小时，由于某种原因，右侧面板向下移动。

结论

我的问题到此为止。如果你有任何问题，尽管问我

同时

我正在寻找JavaEE后端开发人员。哈哈，这个网站需要它！我正在招聘。 谢谢

实验变量

.MembersPanel{

float:right;  

padding-left:[number]%;
margin-right:[number]%;
height:450px; 
width:22%; 
margin-top: 10px; 


border-radius: 4px;
}

整个css代码。

<p:panel class="MembersPanel" >
        <f:facet name="header">
            <p>
           Psst Members over here!
            </p>
        </f:facet>
    </p:panel>

HTML代码。

<p:panel class="MembersPanel" >
        <f:facet name="header">
            <p>
           Psst Members over here!
            </p>
        </f:facet>
    </p:panel>

    
 

Psst成员在这里！

如果您使用%作为div的宽度，请尝试将其用于填充和边距

您的新代码

.MembersPanel{

float:right;  

padding-left:[number]%;
margin-right:[number]%;
height:450px; 
width:22%; 
margin-top: 10px; 


border-radius: 4px;
}

---

您没有发布完整的代码，但是，我会说：在HTML中移动该面板，将其放在大屏幕上相同高度的其他框前面。然后t应该停留在该部分的顶部，其他盒子应该浮动在它的左侧和下方

添加代码后编辑：在正文中，尝试按以下顺序使用HTML：

 <p:panel class="SlideShowBackground">
   <p:imageSwitch class="SlideShowSwitch" effect="turnDown">
    </p:imageSwitch>
 </p:panel>

 <p:panel class="MembersPanel" >
   <f:facet name="header">
     <p>
       Psst Members over here!
     </p>
   </f:facet>
  </p:panel>

  <p:panel class="InsideleftPanelHoldsProj" >
     <ui:include src="./ProjectsELements.xhtml"/>
     <f:facet name="footer">
        <ui:include src="./footer.xhtml"/>
      </f:facet>
  </p:panel>

Psst成员在这里！

未工作面板仍向下移动。我必须将左右边距设置为1%，因为如果设置得更大，它会自动向下移动，因为显然浮动div不能相互重叠。谢谢你的尝试，胡？对不起，我不明白。好吧，你没有发布你的相关代码（其他HTML和CSS，只是面板本身的代码，它没有告诉任何关于它与其他代码的关系），因此，我只能给你一个更一般的答案，描述我认为解决你的问题的必要步骤。对不起，我认为这已经足够了。我工作的时间少了。我将发布我的代码的其余部分。我没有看到任何问题。您所描述的是float属性的预期行为，不是吗？@Iriell是正确的。至少我是这么想的。