Hi everyone, I seem to be experiencing an issue with my content placeholder:
Even though my content is supposed to be inside the placeholder in my ASP code, it appears outside:
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link href="css/style.css" rel="stylesheet" type="text/css" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
<%--<div class="workout-article-table">--%>
<asp:Panel ID="Panel1" CssClass="workout-article-table" runat="server"> <%--takes place of div--%>
<asp:Panel ID="Panel2" CssClass="workout-article-table-column" runat="server"> <%--takes place of span--%>
<%--<span class="workout-article-table-column">--%>
<div class="workout-article-table-blue">
<div class="workout-article-table-title">beginner workout programs »</div>
</div>
<div class="workout-article-table-link-black">
<div class="workout-article-table-link"><a href="#">Beginning Bodybuilding Comprehensive Guide</a></div>
</div>
<div class="workout-article-table-link-gray">
<div class="workout-article-table-link"><a href="#">Resistance-Training For Total Beginners!</a></div>
</div>
<div class="workout-article-table-link-black">
<div class="workout-article-table-link"><a href="#">Best Mass-Building Workout For Beginners</a></div>
</div>
<div class="workout-article-table-link-black">
<div align="center"><span class="workout-blue-links"><a href="#">View All Beginner Programs »</a></span></div>
</div>
<%--</span>--%>
</asp:Panel> <%--takes place of inner span--%>
<asp:Panel ID="Panel3" CssClass="workout-article-table-column2" runat="server"> <%--takes place of span--%>
<%--<span class="workout-article-table-column2">--%>
<div class="workout-article-table-blue">
<div class="workout-article-table-title">intermediate workout programs »</div>
</div>
<div class="workout-article-table-link-black">
<div class="workout-article-table-link"><a href="#">No Longer A Beginner</a></div>
</div>
<div class="workout-article-table-link-gray">
<div class="workout-article-table-link"><a href="#">You're Not A 'Newbie' Anymore!</a></div>
</div>
<div class="workout-article-table-link-black">
<div class="workout-article-table-link"><a href="#">Novice Intermediate Workout!</a></div>
</div>
<div class="workout-article-table-link-black">
<div align="center"><span class="workout-blue-links"><a href="#">View More Workout Programs »</a></span></div>
</div>
<%--</span>--%>
</asp:Panel> <%--takes the place of inner span--%>
</asp:Panel> <%--takes the place of div--%>
</asp:Content>
CSS:
.workout-article-table {
height: 40px;
position: relative;
width: 483pxpx
}
.workout-article-table-column {
float: left;
left: 0;
position: absolute;
top: 0;
width: 229px
}
.workout-article-table-column2 {
float: left;
left: 254px;
position: absolute;
top: 0;
width: 229px
}
.workout-article-table-blue {
background-color: #0F709B;
height: 40px;
width: 229px
}
.workout-article-table-blue-wide {
background-color: #0F709B;
height: 40px;
margin-bottom: 10px;
width: 483px
}
.workout-article-table-link-black {
background-color: #000000;
height: 40px;
width: 229px
}
.workout-article-table-link-gray {
background-color: #27282A;
height: 40px;
width: 229px
}