primefacesのタブの中身が正しく表示されない

PrimeFacesで画面を作成しています。
タブを2つ用意し、それぞれのタブに入力項目を表示するのですが、
画面が表示されたとき、タブ2の「ラベル2」という項目が、
タブ1の「ラベル1」の下に表示されてしまいます。
タブ2を表示させると、「ラベル2」のみ表示され、
そのままタブ1をクリックして表示すると、「ラベル1」の表示されます。

最初からタブ1には「ラベル1」のみ表示させたいのですが、
どうすればできますでしょうか？

xhtml
1<h:body>
2        <ui:composition template="/view/template/Base.xhtml">
3            <ui:define name="content">
4                <h:form>
5                    <p:layout>
6                        <p:layoutUnit position="center">
7                        
8                            <p:tabView>
9                                <p:tab title="詳細1">
10                                    <div class="row-div">
11                                        <label style="text-align: left; display: block; height: 20px; width: 150px">ラベル1</label>
12                                        <p:inputTextarea rows="3"/>
13                                    </div>
14                                   
15                                </p:tab>
16                                <p:tab title="詳細2" >
17
18                                    <label style="text-align: left; display: block; height: 20px; width: 150px">ラベル2</label>
19                                    <h:inputTextarea value="" cols="150" rows="3" readonly="true"/>
20                                </p:tab>
21                            </p:tabView>
22                            
23                        </p:layoutUnit>
24                    </p:layout>
25                </h:form>
26            </ui:define>
27        </ui:composition>
28    </h:body>