Solved

Master page with DIVS in ASP.Net

Posted on 2009-03-30
13
242 Views
Last Modified: 2013-12-17
Greetings all

I have a standard design for an application which consists of the usual header, followed bya  "body" which has two columns and underneath that a footer.  

If teh right column is shorter then the left, then the "footer" floats up under the right, alongside the left. I can get aroiund this by setting lengths fo both columns.

Problem is that this layout is the same for many pages and thus makes sense to do a a MatserPage. If that is so, how do I set the Div lengths, which will vary from page to page? And, is there nbot a better wya to do this?

In advance, thanks!!

   allanmark
0
Comment
Question by:allanmark
  • 7
  • 4
  • 2
13 Comments
 
LVL 26

Expert Comment

by:Anurag Thakur
ID: 24016804
i will suggest you to define your master page in the following manner
this will make sure that your divs will render in correct place

<table>
   <tr>
      <td colspan=2>
           HEADER
      </td>
    </tr>
   <tr>
      <td>
          Right Column
      </td>
      <td>
           Left Column
      </td>
    </tr>
      <td colspan=2>
           Footer
      </td>
    </tr>
</table>
0
 

Author Comment

by:allanmark
ID: 24016891
Sorry ... what I should have also sais was ....

Each page will have different content for BOTH the left and teh right columns.
0
 
LVL 26

Expert Comment

by:Anurag Thakur
ID: 24016919
master page will just have the content place holders and the aspx pages inheriting from the master page will implement the content place holders so the rendering will be as required
0
 
LVL 19

Accepted Solution

by:
daveamour earned 500 total points
ID: 24017287
It is more acceptable these days to avoid tables for layout like this and use CSS instead eg:
http://www.strictlycss.com/examples/three-column-layout-9.asp
 
0
 

Author Comment

by:allanmark
ID: 24017372
I'm happy with the concept of CSS.

What I am not to sure of is how to handle the different column lengths in the various pages.
0
 
LVL 19

Expert Comment

by:daveamour
ID: 24017381
Columns should resize to accommodate the content within them.
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

Author Comment

by:allanmark
ID: 24017443
Sorry ... I'm really getting myself knotted up .. what I meant was ...

Two DIVS / columns (left and right), with left set as "float: left" and  a DIV as a footer underneath -- if teh right column has less content then the footer scrolls up underneath it, alongside the left. I can't figure out the css to stop this.
0
 
LVL 19

Expert Comment

by:daveamour
ID: 24017450
Ok I see
I'm not bad with CSS but not an expert.  You will have a better chance posting this in the CSS area:
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/
 
 
0
 

Author Comment

by:allanmark
ID: 24017640
Got it! Had a look at the site and followed a link.

The answer - enacse the lot in a wrapper div:-

      <div id="wrapper">       
        
          <div id="left" class="leftnav">      
                   <asp:ContentPlaceHolder ID="leftnav" runat="server">
                </asp:ContentPlaceHolder>
           </div>
       
           <div id="right" class="rightnav">      
              <asp:ContentPlaceHolder ID="righnav" runat="server">
              </asp:ContentPlaceHolder>
          </div>
     
      <!-- <div id="wrapper">        -->
      </div>

0
 

Author Comment

by:allanmark
ID: 24017653
Sorry! Doesn't work!  -- I hadn't done a refresh!!
0
 

Author Comment

by:allanmark
ID: 24018083
Working!  Just needed to adjust a few things!

For interest sake:

http://imaginekitty.com/phonyBorders/phonyBorders.html  -- ha a look at source view and got what I needed!
0
 
LVL 19

Expert Comment

by:daveamour
ID: 24018090
Nice one
0
 

Author Closing Comment

by:allanmark
ID: 31564216
Points are yours - your site suggestion led to the solution!  Thank you!!
0

Featured Post

6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

Join & Write a Comment

Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that undeā€¦
It is a freely distributed piece of software for such tasks as photo retouching, image composition and image authoring. It works on many operating systems, in many languages.
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now