Jsf 2 关于将CSS应用于h:panelGrid的问题

希望你们都会好起来。实际上，我设计了一个使用h:panelGrid的页面。我还对它应用了Css类

<h:panelGrid columns="3"
             border=""
             width="20%"
             style="position: absolute; top: 50px;"
             columnClasses="asteriskColumns, nameColumns" >

    <h:outputText value="*" />
    <h:outputText value="Map: " />
    <p:fileUpload id="uploadMapImage"
                  description="Image"
                  update="messages"
                  allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
                  auto="true"
                  fileUploadListener="#{cityDetail.imageUpload}" >


     </p:fileUpload>

     <h:outputText value="*" />
     <h:outputText value="Image1: " />
     <p:fileUpload id="uploadImage1"
                   description="Image"
                   update="messages"
                   allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
                   auto="true"
                   fileUploadListener="#{cityDetail.imageUpload}" >


     </p:fileUpload>

     <h:outputText value="*" />
     <h:outputText value="Image2: " />
     <p:fileUpload id="uploadImage2"
                   description="Image"
                   update="messages"
                   allowTypes="*.jpg;*.png;*.gif;*.jpeg;"
                   auto="true"
                   fileUploadListener="#{cityDetail.imageUpload}" >

     </p:fileUpload>

 </h:panelGrid>

}

现在发生了什么。我只有一排。所以如果我用这个

<h:panelGrid columns="4"
             cellpadding="5"
             border=""
             style="position: absolute; top: 200px;"
             rowClasses="ButtonStyle" >

如果我制作了一个单独的文件，然后像这样应用样式类

style="color: white;
       background-color: transparent;
       border: transparent;
       padding-left: 22%;
       cursor:pointer"

<h:commandButton type="button"
                 label="save"
                 value="Save"
                 actionListener="#{cityDetail.sendImagesToDatabase}"
                 action="#{cityDetail.save}"
                 styleClass="style"/>



.style {

    color: white;
    background-color: transparent;
    border: transparent;
    padding-left: 22%;
    cursor:pointer"

}

.风格{
颜色：白色；
背景色：透明；
边界：透明；
左：22%；
光标：指针“
}

除了“边框：透明；“为什么

按钮显示其周围的边框。为什么它使用style而不是styleClass

谢谢

style="color: white;
       background-color: transparent;
       border: transparent;
       padding-left: 22%;
       cursor:pointer"

<h:commandButton type="button"
                 label="save"
                 value="Save"
                 actionListener="#{cityDetail.sendImagesToDatabase}"
                 action="#{cityDetail.save}"
                 styleClass="style"/>



.style {

    color: white;
    background-color: transparent;
    border: transparent;
    padding-left: 22%;
    cursor:pointer"

}