Different page heights

I have a website whose pages are pretty much the same height, however, I have 3 pages that are considerably longer than the others. It uses an accordion spry that has about 15 tabbed panels. When I expand some of the content areas of the spry panels, the lower panels extend below the footer. I want to change the page height of just those pages that use the accordion spry to make it larger.

You shouldn't be expressing height values on any containers with text in them. Height is determined by content and that varies by page and the text-size people use in their browsers. Explicit height values actually limit how much content your containers can hold which can be very bad for usability reasons. If you need to reveal a background image, use the min-height property instead of height.
Nancy O.

Similar Messages

Templates and different page heights

I am finishing up a site. This is my first attempt at moving from print to web design so I'll do my best with terminology. I have used a template I created to make all the pages for the site. All of the pages have the same height except for 1 page which has a much greater height. If I increase the value of the editable region it does not work because the container is still set to the original template size. If I change the container height on that specific one page it works but it changes it on all my other pages too. I do I achieve this?

As John said, we can't begin to guess what you have going on. You'll need to upload your page to a test folder on your remote server and post a URL for us to see.
In a nutshell, height property is a restriction in all browsers except IE. Height values should not be used in content areas that may fluctuate across site pages.
If needed to reveal a backround image, for example, use the min-height property instead of height.
#div {
min-height: 300px;
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com

Target Named Anchor in a Spry Collapsible Panel from a different page

Let me start by saying I have combed this forum (and others) looking for a resolution to this. I am familiar with David Powers solution on Foundationphp.com and am using that code in project to open the collapsible panel from a separate page and it works beautifullly. The problem I have is that I want the browser to move down to a specific named anchor inside that opened collapsible panel when clicked from a different page.
Snippets of my current code here.
Below is the code that I have on an image that when clicked goes to the correct page and opens Panel1. Works Perfectly!
<a href="bamboo-species.php?col1=open#CollapsiblePanel1"><img src="images/Content/Photos/HomeScroll/blackTmbor.jpg" width="227" height="175" /></a>
Below is the link to the .js file and the script in the head of the target page
<script type="text/javascript" src="SpryAssets/SpryURLUtils.js"></script>
<script type="text/javascript">
// Grabs the values of the URL parameters for the current URL.
var params = Spry.Utils.getLocationParamsAsObject();
</script>
Below is the code that I have on the target page for Panel1
<script type="text/javascript">
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:params.col1 ? true : false},{duration: 1000});
</script>
If I have a named anchor say <a name="species1" id="species1"></a> down in the page, how do I target that named anchor from my link on the separate page. I have tried adding the #species1 to the end of the link on the link page (see below) but with no luck. I believe those were the instructions on foundationphp.com site.
<a href="bamboo-species.php?col1=open#CollapsiblePanel1#species1"><img src="images/Content/Photos/HomeScroll/blackTmbor.jpg" width="227" height="175" /></a>
I hope (and suspect) that this is an easy fix, I just do not know what it is. Any help or direction where to look is greatly appreciated.

I once had the same issue can created a small function that allows me to "jump" to a element.
function scrollTo( element ){
     var stylize = function( element){ return !+"\v1" ? element.currentStyle : document.defaultView.getComputedStyle( element , null ) },
          getPosition = function( element ){
               // based on the SpryEffect's module:
               var computedStyle, tryComputedStyle,
                    position = { x: 0, y: 0 };
                    if ( element.style.left && /px/i.test(element.style.left) ){
                         position.x = parseInt(element.style.left, 10); // without padding
                    } else {
                         computedStyle = stylize( element );
                         var tryComputedStyle = computedStyle && computedStyle.left && /px/i.test( computedStyle.left );
                         if (tryComputedStyle)
                              position.x = parseInt( computedStyle.left, 10 ); // without padding, includes css
                         if(!tryComputedStyle || position.x == 0) // otherwise we might run into problems on safari and opera (mac only)
                              position.x = element.offsetLeft;   // includes padding
                    if ( element.style.top && /px/i.test(element.style.top) )
                         position.y = parseInt( element.style.top, 10); // without padding
                    else
                         if ( !computedStyle )
                              computedStyle = stylize( element );
                    var tryComputedStyle = computedStyle && computedStyle.top && /px/i.test( computedStyle.top );
                         if ( tryComputedStyle )
                              position.y = parseInt( computedStyle.top, 10 ); // without padding, includes css
                         if( !tryComputedStyle || position.y == 0 ) // otherwise we might run into problems on safari and opera (mac only)
                              position.y = element.offsetTop;   // includes padding
               return position;
          scroll( 0, getPosition( element ).y );
So now we have a scrollTo function that accepts a pure HTML element as argument, all what is left to do is figure out if we have a hash, and if the anchor exits on the page.
( hopes this works, i wrote it without testing, but you get the general idea ):
if( window.location.hash ){
     var hash = window.location.hash.substr(1), // remove the # from the hash
     element;
     // as anchors can also be used with id attributes, check that first,
     element = document.getElementById( hash );
     // maby we used name="" attribute
     if( !element && ( element = document.getElementsByName( hash )) ){
          element = element[0];
     // if we have a match:
     if( element ){
          // give the collapsible panel some time to init and update the DOM;
          setTimeout(function(){ scrollTo( element ) },0);
\o/

Auto adjustment of page orientation causes printing issues with documents that have a page width greater than its page height.

Hi,
Since an upgrade from Word 2003 to Word 2010, we are experiencing printing issues with certain
documents that have a page width greater than its page height.
In Word 2003, it was no problem to set the page width greater than the page height while setting the page orientation to "portrait".
In Word 2010, this seems impossible: despite leaving the page orientation to "portrait", if one changes the page width/height as stated,
Word 2010 automatically adjusts the orientation to "landscape". Resetting the orientation to "portrait" will flip the page's width/heigth settings.
This behaviour causes printing problems: the page prints out 90° rotated.
I do not believe this is a printer driver issue: I tried several different printer drivers, and all give the same (bad) result. Setting the printer driver's page orientation settings (before printing) makes no difference, as
Word 2010 seems to force the page orientation settings.
Inserting the documents 90° rotated is not an option, since it causes problems with the printing margins.
This is very annoying, since we have to print official documents of a municipality (driver's licences).
Is there a workaround for this issue?
Regards,
Laurent Grandgaignage
Sysadmin Gemeentebestuur Stabroek, Belgium

Hi
Thank you for using
Microsoft Office for IT Professionals Forums.
From your description, we can follow these steps to test this issue
Step 1: Repair Office 2010
1.
Click
Start, and then click Control Panel.
2.
Click
Programs and Features.
3.
Click the
Office 2010 program that you want to repair, and then click
Change.
4.
Click
Repair, and then click Continue. You might need to restart your computer after the repair is complete.
Step 2:
Rename the global template (Normal.dotm)Follow the steps for the operating system that you are using:
Windows Vista and Windows 7
a)
Exit Word 2010
b)
Click
Start.
c)
In the
Start Search box, type the following text, and then press
ENTER:
1.
%userprofile%\appdata\roaming\microsoft\templates
d)
Right-click
Normal.dotm, and then click Rename.
e)
Type
Oldword.old, and then press ENTER.
Microsoft Windows XP
a)
Exit Word 2010
b)
Click
Start, and then click Run.
c)
In the
Open box, type the following text, and then press ENTER:
%userprofile%\Application Data\Microsoft\Templates
d)
Right-click
Normal.dotm, and then click Rename.
e)
Type
Oldword.old, and then press ENTER.
f)
Close Windows Explorer.
How to troubleshoot print failures in Word 2010, Word 2007, and Word 2003
http://support.microsoft.com/kb/826845
Please take your time to try the suggestions and let me know the results at your earliest convenience. If anything is unclear or if there is anything
I can do for you, please feel free to let me know.
Hope that helps.
Sincerely
William Zhou CHNPlease remember to mark the replies as answers if they help and unmark them if they provide no help.

How do I create an auto page height with nested divs

I am using DW4 to create a website and am using nested divs to create the auto widths for the browsers
How do I make the height auto adjust for differing amounts of content? Different pages have different amounts of content so I want that height to auto flex with it if I can. Currently I give the Container a fixed height, but that is limiting ...
Here is my code so far - have not assigned specific style sheets yet
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">

</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="Container">
<div id="Header">
<div class="largewhite" id="towncarheader">Northwest Town Car Services</div>
<div class="redtext" id="phone">
    <div align="right"><strong>Reservations | 503-702-5999</strong></div>
</div>
<img src="images/head.jpg" width="756" height="150" alt="BLue header" />
</div>
<div id="bodycontent">
    <p>Portland Airport Shuttle Services <br />
      Transportation to and from PDX International airport<br />
      How you make your next trip to Portland Airport could be the best thing about your journey.<br />
      By choosing Northwest Town Car’s Airport Shuttle Service, you will have chosen a stress free solution for your trip, both there and back. <br />
      First time customers: <br />
      When you reserve your first trip to PDX Airport receive 20% discount when paying by cash or check. | 10% if you pay by credit card. <br />
      Our service area covers:<br />
      Greater Portland areas<br />
      Beaverton<br />
      Hillsboro<br />
      Tigard<br />
      Tualatin<br />
      Lake Oswego<br />
      West Linn <br />
      View a complete list of our Locations and Rates & Services <br />
      Call for your reservation - 503-702-5999 | Or make your Shuttle reservation online.<br />
      We take care of the details.<br />
      Our luxury sedans provide the best alternative transportation solutions for every busy traveller. Whether you are taking a business or a personal trip, we will take care of the details.<br />
      We always arrive at least 5 minutes early at your doorstep. We make certain you have plenty of time so you can check in, check your luggage.<br />
    </p>
    <p>Our chauffeurs are experienced and will make sure they have your returning flight details so we can track your flight. We know if your plane will be delayed or a little early. Knowing that we will be there waiting for you when you arrive, no matter what time it is, gives you a bit more peace of mind.<br />
      Getting you to your destination safely is our priority and we pride ourselves in knowing the area well and providing the best routes available.<br />
      Our mark of success is your satisfaction.<br />
      Northwest Town Car opened its doors in 1998 and is proud to continue providing superior sedan and town car transportation choices to our customers.<br />
      Our Vehicles<br />
      We offer a variety of vehicles to meet your business and personal needs.<br />
      Our Fleet includes Town Cars, SUV’s, and Mini Vans.<br />
      Additional Services<br />
      Business / Executive events<br />
      We work with local corporations, businesses and hotels across town. Our areas of coverage include:<br />
      Westside<br />
      Beaverton<br />
      Tigard<br />
      Tualatin<br />
      Lake Oswego<br />
      Downtown Portland<br />
      Personal events<br />
      No matter the occasion we can get you to your destination safely and in style.<br />
      Weddings<br />
      Parties<br />
      Personal night on the town<br />
      Tours including Wine tours</p>
</div>
<div class="redtext" id="footer"> © 2010 Northwest Town Car Service</div>
<div id="navbar">
    <ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="#">Home</a></li>
      <li><a href="#">Fleet</a>      </li>
      <li><a href="#">Rates | Services</a></li>
      <li><a href="#">Testimonials</a></li>
      <li><a href="#">Resource Links</a></li>
      <li><a href="#">Contact</a></li>
    </ul>
</div>
<p> </p>
<p> </p>
</div>
<script type="text/javascript">

</script>
</body>
</html>
Thanks Kathryn

#1 Don't use the Height property on any wrappers or containers that will hold text. Height is a restriction in every browser except IE -- which treats height as if it were min-height. People need to be able to increase text size in browser (View, Zoom , Text only) without causing damage to the page.
#2 Why are you using absolute positioning? Don't you realize this layout method is a huge cross to bare?
Here is why:
http://apptools.com/examples/pagelayout101.php
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Different layouts for different pages

hi all,
i have created a form in which there are 5 output pages but the print preview shows only the first page out of 5.i want to go to the next page.plz help how would i do that.and i want different layouts for different pages.
thnks n regards,
mukesh.

Hi Mukesh,
Read these lines which has been given in help.sap.com and also go through the link given below.
Main Window on Several Draft Pages :
if you want the pages on which a table with items is printed to have different layouts. Height and position of the main window may differ on the different pages, but the width must remain the same throughout.
[Main Window|http://help.sap.com/saphelp_nw70/helpdata/en/b1/243fdabeee11d4b633006094192fe3/content.htm]
Regards,
Sravanthi

Page Footer : utilisation different page footers with different dimension

In my document I use different page u2013footers sections, I know that CR takes as reserved space the minimum space of the greatest page-footer section, is there a possibility to have different page footer sections with different dimensions

hi,
"Clamp Page Footer" option can be used to remove extra space at the bottom of the report. This option can be used such that each page height varies.
Regards,
Vamsee

Report Layout for different page sizes....

hi...by chance my report (which was developed for an A4(letter size) paper) printed on a legal size page(8x13 inch) which left alot of blank space on the bottom of page which was giving a bad look to my report. So I want to know that is there anyway to develop the reports so that they set the reports width n height automatically with different page sizes?

nobody is willing to answer this?

Copying / Cloning component tree elements to different pages

I am copying a DataTable element to a session bean so that I can use it on a different page.
On the new page I have a DataTable tag in the JSP which is bound to the DataTable in session. However, only the attributes of the DatatTable element are rendered (e.g. <DIV style='height:999px; width:99px;'>, not the children components (e.g Columns).
I presume the problem is because most of the references in the session bean component refer to a different view. Am I correct in my thinking? If so, is there a way to clone? (I know it is not supported in UIComponent)?
PS. Fundamentally, I am have many pages with tabbed or scrollable datatables. I want to 'send' these to one generic page. Here I can disable the scroll bar / pages, so that all rows are visible and then the user can print the table content.
Edited by: lafual on Feb 6, 2008 3:34 AM

Thinking this blog would indicate we would need to create a new viewset for the additional view on the window for CatDDLB
then figure out how to get / code the data to the window?
/people/vikash.krishna/blog/2009/10/08/crm-70-how-to--5b-create-an-overview-page-with-content

[AS] using [JS][OSX] find page height/width

I've been struggling to find a way to determine the page count, height, and width of a PDF without requiring Acrobat. I've stumbled up a JS that can count pages using Finder. Now I need to determine the page height/width in order to find which is the greater number. It can be using Photoshop 7.0 of Finder. The reason I'm looking for a JS script and not AS script is because it doesn't seem AS is robust enough [yet] to read this.
current working code for page count:
tell application "Finder"
set theItems to choose file
do shell script "/usr/bin/mdls -name kMDItemNumberOfPages " & quoted form of POSIX path of result & " | /usr/bin/grep -o '[0-9]\\+$'"
return result as integer
end tell
Know of anything similar to find and or compare page height/width??

The height and width of a PDF can be different on every page -- it's not
something fixed for a whole document.
Shane Stanley

How can i redirect to with one button to different pages!

Hi All,
For any application, for the first time,if a new table exists then there will no data in that table.
based on this scenerio,in my application,i am handling apex validation staying that "you have no data. Please click here to go Reset symbol page.
when it redirects to Reset symbol i am providing a text box and with a button. Once there enter a symbol and click on button it will inert in that table and again redirects to Home page for say-39.
simillarly what are the functionality available in home page i had implemented same thing but only it differs page no for say-115.
In both the scenerio's i will be redircting reset Symbol page where there can insert a symbol explained in above scenerio case.
My problem is when i am throwing the error msg from page-39 i am redirecting to Reset symbol and when there enter symbol and click on button again i will be redirection t page -39 because the error had came from page-39.
If the same error comes from page-115 then also i will redirecting to same Reset Symbol where there will be entering symbol and click on button, in this case it should redirect to page-115 instead of page-39 because i have got error from page-115 but not from page-39.
How to handle the above scenerio, please help me out.
Thanks in advance,
Anoo.

Hi Andy,
Thanks for your suggestion, it is working fine..But i am facing one problem in page 115, i have two regions and both regiosn have same name but only difference is items names.. when i had tried to rediect to page-115 the umwanted one regions is showing instead of expected region. It is getting failed here bec it is rediecting to differnet region.
Any suggestion on this!
Thanks,
Anoo..

Setting different pages widths in different sections - Pages 5.2

In Pages 5.2, how does one set different page widths (margins) in different sections?

You can't. Margins apply to the entire document.
What you can do is set the margins to their max width and then use left and right indents for the sections you want narrower.
Peter

How to create a report with different page sizes

Hi,
I would like to create a report with different page sizes, it's possible to do it with diadem?
When I change the layout parameters, changes afect to all sheets...
Is there a way to change page size individually for each sheet?
Thanks in advance.
Marc

Hi Marc,
You can use the DocStart and DocEnd commands along with the PicPrint command to spool multiple print commands to the same output PDF file using the direct printer approach. This should enable you to programmatically specify the page size differently for each sheet that you add to the print job.
' Print PDF Page by Page.VBS
OPTION EXPLICIT
Dim i, Path, OldPrintName
Path = AutoActPath & "2D Stacked"
Call DataDelAll
Call DataFileLoad(Path & ".TDM")
PDFFileName = Path & " Page by Page.pdf"
IF FileExist(PDFFileName) THEN Call FileDelete(PDFFileName)
OldPrintName = PrintName
PrintName = "winspool,DIAdem PDF Export,LPT1:" ' Set to PDF printer
PDFResolution = "72 DPI" ' "2400 DPI" , "default"
PDFOptimization = TRUE
PDFFontsEmbedded = FALSE
PDFJPGCompressed = "high"
PrintOrient = "landscape" ' orient paper
Call PrintMaxScale("GRAPH") ' auto-max, see alternative margin setting variables below
PrintLeftMarg = 0.181
PrintTopMarg = 0.181
PrintWidth = 10.67
'PrintHeigth = 7 (read-only)
Call WndShow("REPORT")
Call DocStart ' Begin multi-page document/print job
FOR i = 1 TO 4
Call PicLoad(Path & ".TDR")
Call GraphSheetNGet(1)
Call GraphSheetRename(GraphSheetName, "Page " & i)
Call PicUpdate
Call PicPrint("WinPrint") ' Add a page to be printed
NEXT ' i
Call DocEnd ' End multi-page document/print job
PrintName = OldPrintName
Call ExtProgram(PDFFileName)
Brad Turpin
DIAdem Product Support Engineer
National Instruments

Hi, I managed to publish my website on the server. The server recognize the different pages when I write the url, but when I use the a tag to surf to the next page it doesn't recognize the link.

Here below you can find my coding > And I highlighted the links that refer to my different pages:
<div id="Main_navMenu">
    <ul>
        <li><a href="/index.html">HOME</a></li>
        <li><a href="#">NIEUWS</a>
        <ul>
            <li><a href="/pages/nieuws.html">ACTUALITEIT </a></li>
            <li><a href="#">ACTIVITEITEN</a></li>
            <li><a href="#">ARCHIEF</a></li>
        </ul>
    </li>
    <li><a href="#">ADVIES</a>
        <ul>
               <li><a href="/pages/contract.html">CONTRACT</a></li>
                <li><a href="#">CHECKLIST</a></li>
                <li><a href="#">UITKERING</a></li>
                <li><a href="#">JURIDISCH</a></li>
        </ul>
    </li>
    <li><a href="#">WIE WE ZIJN</a>
        <ul>
                <li><a href="#">BESTUURSLEDEN</a></li>
                <li><a href="#">WAT WE DOEN</a></li>
                <li><a href="#">ONZE LEDEN</a></li>
        </ul>
    </li>
    <li><a href="#">INFORMATIE</a>
        <ul>
                <li><a href="#">STATUTEN</a></li>
                <li><a href="#">FAQ</a></li>
                <li><a href="#">LINKS</a></li>
        </ul>
    </li>
    <li><a href="#">LID WORDEN</a>
        <ul>
            <li><a href="#">INSCHRIJVEN</a></li>
            <li><a href="#">INLOGGEN</a></li>
        </ul>
    <li><a href="#">CONTACT</a></li>
    </ul>
</div>

Maddy dOliveira wrote:
Hi,
Thanks and yes, this is a test website.
The link for news (nieuws) works now, but the link for Advies - contract gives this as result: http://www.maddydoliveira.com/DeActeursGilde/pages/pages/contract.html
As you can see the link is looking for pages within pages.
Is there a possibility to solve this issue? I've tried now for a small hour,.. and didn't manage to find a solution.
Thanks in advance,
Maddy
If you just change the links to point to the 'pages' folder in the 'DeActeursGilde' folder instead of them pointing outside of the folder to the site server root which a / leading slash does that should solve your issue. With the leading slash the browser is looking for a folder named 'pages' outside of the 'DeActeursGilde' folder instead of looking for a 'pages' folder inside of it.
<a href="pages/contract.html">CONTRACT</a>
Contract
I think when you create links in Dreamweaver you have an option to choose 'site root relative' links or 'document relative' links - well you always want document relative links.

Creating a document with different page sizes.

I'm trying to produce a leaflet with different pages sizes. To try and explain what I mean I have included a picture of what I'd like the front cover to look like. When producing a booklet there doesn't seem to be a provision to individually alter each page size in the pages or document set up panel. Is there anyway around this or do I have to create each page seperately, export to pdf and then combine into the leaflet? Help gratefully received. tomas

The build booklet feature is for very basic booklets, not something like this.
Sorry, but you’ll need to make everything full size and then do the cutting.
Bob

Different page heights

Similar Messages

Maybe you are looking for