I use the recommended code for setting tile postbacks (below) and I found that it changes the inline height Css to 185px. The two screenshots show the affect, it changes the horizontal layout and the tilelist height. Project code below, screenshots attached.
<%@ Page Language="C#" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" href="/App_Themes/Edway/Edway.css" type="text/css" />
<link rel="stylesheet" href="mypage.css" type="text/css" />
<style>
.left {
align-items: center;
}
.wideContent {
width: 290px;
height: 130px;
font-family: Segoe UI;
padding: 10px;
}
.squareContent {
width: 100px;
height: 120px;
padding: 10px;
}
.shortContent {
height: 105px;
}
.font14 {
font-size: 14px;
}
.font16 {
font-size: 16px;
}
.peekTemplateClass {
width: 120px;
height: 120px;
padding: 10px;
font-size: 13px;
line-height: 20px;
}
.feedback {
width: 120px;
height: 120px;
font-size: 13px;
line-height: 20px;
}
/* group heading tile appearance */
.groupHeadingTitle {
height: 120px;
width: 120px;
position: relative;
}
.innerTitle {
width: 120px;
height: 40px;
top: 50%;
margin-top: -20px;
position: absolute;
font-size: 17px;
line-height: 20px;
padding-left: 10px;
}
div.noHover.RadTile {
border-color: transparent;
}
/* change tile texts to better fit long names and show over the images */
.RadTile div.rtileBottomContent {
font-weight: bold;
width: auto;
max-width: 120px;
color: Black;
/* semi-transparent background like this will work in CSS3 compatible browsers */
background-color: rgba(255,255,255,0.5);
height: 20px;
line-height: 20px;
padding: 0 10px;
bottom: 10px;
}
</style>
<!-- remove this function and the layout of the tiles changes
<script type="text/javascript">
function resetAutoPostBackTile(sender, args) {
var tiles = sender.get_allTiles();
for (var i = 0; i < tiles.length; i++) {
//a default condition would be if the tile has NavigateUrl set
//you can use a custom one - e.g., the presence of a CSS class
if (tiles[i].get_navigateUrl()) {
tiles[i].set_autoPostBack(false);
}
}
}
-->
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadTileList ID="RadTileList1" runat="server" TileRows="1" Skin="Bootstrap" AutoPostBack="true" OnClientLoad="resetAutoPostBackTile" CssClass="left" >
<Groups>
<telerik:TileGroup>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile1" runat="server" Width="120px" Height="120px" NavigateUrl="student-Program-progress.aspx" Target="_self" Text="Gradebook">
<PeekTemplate>
<div class="squareContent font14">
See your complete gradebook
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile2" runat="server" Width="120px" Height="120px" NavigateUrl="/Help/MyPage.htm" Target="_blank" Text="Help" BackColor="#f8b617">
<PeekTemplate>
<div style="background-color: #f8b617" class="squareContent font14">
See help for your homepage
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="TextTileProfile" Name="TextTileProfile" runat="server" Width="120px" Height="120px" NavigateUrl="/MyPage-UserInfo.aspx" Target="_blank" Text="Profile" BackColor="#f37928">
<PeekTemplate>
<div style="background-color: #f37928" class="squareContent font14">
Update your password
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="tileLogout" runat="server" Width="120px" Height="120px" Text="Logout" BackColor="#03953f" AutoPostBack="true">
<PeekTemplate>
<div style="background-color: #03953f" class="squareContent font14">
Logout
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
</telerik:TileGroup>
</Groups>
</telerik:RadTileList>
<telerik:RadTileList ID="RadTileList2" runat="server" TileRows="1" Skin="Bootstrap" AutoPostBack="true" OnClientLoad="resetAutoPostBackTile" CssClass="left" >
<Groups>
<telerik:TileGroup>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile3" runat="server" Width="120px" Height="120px" NavigateUrl="student-Program-progress.aspx" Target="_self" Text="Gradebook">
<PeekTemplate>
<div class="squareContent font14">
See your complete gradebook
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile4" runat="server" Width="120px" Height="120px" NavigateUrl="/Help/MyPage.htm" Target="_blank" Text="Help" BackColor="#f8b617">
<PeekTemplate>
<div style="background-color: #f8b617" class="squareContent font14">
See help for your homepage
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile5" Name="TextTileProfile" runat="server" Width="120px" Height="120px" NavigateUrl="/MyPage-UserInfo.aspx" Target="_blank" Text="Profile" BackColor="#f37928">
<PeekTemplate>
<div style="background-color: #f37928" class="squareContent font14">
Update your password
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
<telerik:RadImageAndTextTile ID="RadImageAndTextTile6" runat="server" Width="120px" Height="120px" Text="Logout" BackColor="#03953f" AutoPostBack="true">
<PeekTemplate>
<div style="background-color: #03953f" class="squareContent font14">
Logout
</div>
</PeekTemplate>
<PeekTemplateSettings CloseDelay="6000" Animation="Fade" HidePeekTemplateOnMouseOut="true"
ShowPeekTemplateOnMouseOver="true" />
</telerik:RadImageAndTextTile>
</telerik:TileGroup>
</Groups>
</telerik:RadTileList>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
</form>
</body>
</html>