Skip to Content
0

how to fix responsive table header?

Dec 27, 2016 at 11:18 AM

46

avatar image
Former Member

SPAN { font-family: "Courier New"; font-size: 12pt; color: #000000; background: #FFFFFF; } .L1S32 { color: #7D9EC0; } .L1S33 { color: #009300; }

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
controllerName="zfheader.app" xmlns:html="http://www.w3.org/1999/xhtml">
<Page title="fixedheader">
<content>














<ScrollContainer
height="800px"

horizontal="true"
vertical="true"

focusable="true">

<Table id="Comp"


class="mySuperRedButton"




growingScrollToLoad="true"
inset="false"
items="{flight_detailsSet>/flight_detailsSet}">
<columns class="fixed">
<Column
minScreenWidth="Tablet"
demandPopin="true"
class="fix" height="80px"
>
<Text text="Company ID" />
</Column>

<Column
minScreenWidth="Tablet" height="80px"
demandPopin="true"
class="fix"

>
<Text text="Country" />
</Column>


<Column
minScreenWidth="Tablet" height="80px"
demandPopin="true"
width="8em"
class="fix">
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" height="80px"
demandPopin="true"
width="8em"
class="fix">
<Text text="Company Name" />
</Column>
<Column
minScreenWidth="Tablet" height="80px"
demandPopin="true"
width="8em"
class="fix">
<Text text=" Company Location" />
</Column>
<Column
minScreenWidth="Tablet" height="80px"
demandPopin="true" class="fix"
width="8em">
<Text text="Country" />
</Column>


<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true" width="8em">
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Company Name" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text=" Company Location" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Country" />
</Column>


<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em" >
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em" >
<Text text="Company Name" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text=" Company Location" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Country" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true" width="8em">
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Company Name" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text=" Company Location" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Country" />
</Column>

<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true" width="8em">
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Company Name" />
</Column>
<Column
minScreenWidth="Tablet" class="fix"
demandPopin="true" height="80px"
width="8em">
<Text text=" Company Location" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Country" />
</Column>

<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em">
<Text text="Company ID" />
</Column>


<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true" width="8em">
<Text text="Company ID" />
</Column>
<Column
minScreenWidth="Tablet" class="fix" height="80px"
demandPopin="true"
width="8em" >
<Text text="Company ID" />
</Column>













</columns>
<items>
<ColumnListItem>
<cells>

<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />


<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />


<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />



<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />


<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />


<Text

text="{flight_detailsSet>Carrid}" />

<Text

text="{flight_detailsSet>Connid}" />

<Text
text="{flight_detailsSet>Currency}" />
<Text

text="{flight_detailsSett>Planetype}" />

<Text

text="{flight_detailsSett>Planetype}" />

<Text

text="{flight_detailsSett>Planetype}" />
<Text

text="{flight_detailsSett>Planetype}" />


<Text

text="{flight_detailsSett>Planetype}" />
<Text

text="{flight_detailsSett>Planetype}" />

<Text

text="{flight_detailsSett>Planetype}" />
<Text

text="{flight_detailsSett>Planetype}" />



</cells>
</ColumnListItem>
</items>
</Table>
</ScrollContainer>
</content>




<html:style>




.mySuperRedButton {
color: blue;
overflow: scroll;
width: 80%;
position: fixed;
top: 0;
bottom: 0;
left:0;




}
.fix{

position: fixed;
margin: 0 auto;
display: block;
}

fixed {
display: block;
position: relative;
}
</html:style>





</Page>

</core:View>

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

0 Answers