?
Solved

Master page with DIVS in ASP.Net

Posted on 2009-03-30
13
Medium Priority
?
252 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
RHCE - Red Hat OpenStack Prep Course

This course will provide in-depth training so that students who currently hold the EX200 & EX210 certifications can sit for the EX310 exam. Students will learn how to deploy & manage a full Red Hat environment with Ceph block storage, & integrate Ceph into other OpenStack service

 
LVL 19

Accepted Solution

by:
daveamour earned 2000 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
 

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

Learn by Doing. Anytime. Anywhere.

Do you like to learn by doing?
Our labs and exercises give you the chance to do just that: Learn by performing actions on real environments.

Hands-on, scenario-based labs give you experience on real environments provided by us so you don't have to worry about breaking anything.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

More often than not, we developers are confronted with a need: a need to make some kind of magic happen via code. Whether it is for a client, for the boss, or for our own personal projects, the need must be satisfied. Most of the time, the Framework…
This article shows how to deploy dynamic backgrounds to computers depending on the aspect ratio of display
Michael from AdRem Software explains how to view the most utilized and worst performing nodes in your network, by accessing the Top Charts view in NetCrunch network monitor (https://www.adremsoft.com/). Top Charts is a view in which you can set seve…
This tutorial will teach you the special effect of super speed similar to the fictional character Wally West aka "The Flash" After Shake : http://www.videocopilot.net/presets/after_shake/ All lightning effects with instructions : http://www.mediaf…
Suggested Courses

765 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