English German Spanish French Chinese

Sign In
Join

Home › Learn › General ASP.NET Videos › How Do I: Use Cascading Style Sheets for Web Page Layout?

[How Do I:] Use Cascading Style Sheets for Web Page Layout?

In this video we learn how to use

elements in combination with cascading style sheets (CSS) to create robust and higher performance web pages. The

based approach will be compared to the based layout approach used by most web sites over recent years. Then, several CSS-based approaches will be shown, ranging from absolute positioning to floating elements. We also learn the benefits of separating structural HTML from design with the use of CSS.

Presented by Chris Pels

Duration: 29 minutes, 19 seconds

Date: 05 October 2007

Watch Video | Download Video | VB Code C# Code

Audio downloads: AAC | WMA | MPEG-4 | MPEG-3 | MPEG-2

Comments : 21

Leave a Comment

dev777 : On March 28, 2008 12:23 PM said:

Hello Chris,

I really like this video. I learned alot from it. I just have one question. Based on the DIVLayout5.aspx example from the video. I tried to add a menu control in the header, which it set to horizontal. But when i ran it and i tried to reduce the size of the window, it cut off the menu. How to avoid this problem?

Thanks!

hameedsharif : On May 02, 2008 1:30 PM said:

Hello Chris,

I have learned a lot from this video. Thanks. I am using layout based on DIVLayout5.aspx. When I click a link in the left column, the new content does not get displayed in the center. It gets displayed in a new window, although I am setting "Target='content'" in the following sample code:

Target="content" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="FAQs" Font-Bold="true" ForeColor="White"

NavigateUrl="custgenfaqs.aspx"

The complete code for your reference is as follows:

<%@ Page Language="C#" %>

">www.w3.org/.../xhtml1-transitional.dtd">

www.w3.org/.../xhtml" >

Product Support

Target="_parent" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="Home" Font-Bold="true" ForeColor="white"

NavigateUrl="DIVLayout5.aspx"

Target="content" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="FAQs" Font-Bold="true" ForeColor="White"

NavigateUrl="custgenfaqs.aspx"

Target="_parent" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="Requests" Font-Bold="true" ForeColor="White"

NavigateUrl="SendMail.aspx"

Target="content" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="Contact Us" Font-Bold="true" ForeColor="White"

NavigateUrl="faqgen.aspx"

Target="content" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="Feedback" Font-Bold="true" ForeColor="White"

NavigateUrl="Feedback.aspx"

Target="content" ONMOUSEOVER="this.style.color='#ff7755';" ONMOUSEOUT="this.style.color='white'"

Text="Search" Font-Bold="true" ForeColor="White"

NavigateUrl="searchleft.aspx"

Let Us Help You 24/7 - Online Solutions For Your Problems

Read this first. It will be well worth your time.

The following represents the best path to take to get you the answer you need with the greatest speed and simplicity.

1st Check out our FAQs (Frequently Asked Questions). They will most likely have your question and the answer you need. This takes just a click or two of your mouse button. The questions have been sorted into categories for quick and easy selection. The most recent and often selected questions are shown.

Target="_parent"

Text="FAQs" ForeColor="Blue"

NavigateUrl="custgenfaqs.aspx"

Can't find your question quickly or it is not in the list? Go to this next step.

2nd Go to our Search and enter what you are looking for.

These first two steps usually yield almost instantaneous results to help you. However, you can always reach us with a reasonable turnaround time by the following two ways.

3rd Send us an email with your request using our Form . This has the convenience for you being able to do this 7 days a week and 24 hours a day. The Forms page is easy to fill out and you will receive an email response within 24 hours.

Target="_parent"

Text="Requests" ForeColor="Blue"

NavigateUrl="SendMail.aspx"

4th Call or Fax us by using the information on our Contact Us. It has the phone numbers to use and the times we are available either live or by leaving a voicemail. We will respond to a voicemail message within 48 hours.

Target="content"

Text="Contact Us" ForeColor="Blue"

NavigateUrl="faqgen.aspx"