How to stretch content div at the bottom of page.

Summer messing around with my site so I had to create a new.

However, I can't stretch the div contained to the bottom of the page if the page does not meet the content text.

I have a footer at the bottom of the page that spans the entire width of the page, so I can't use the thing with the bottom of the body.

I found a large number of results on the internet, but it seems to me a little lost.

Can someone help me?

It's my HTML code:

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional / / IN" "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 "/ >"
<!-TemplateBeginEditable name = "doctitle"-->
Schudden fansite < title > < / title >
<! - TemplateEndEditable - >
<!-TemplateBeginEditable name = "head"->
<! - TemplateEndEditable - >
"" < link href = "... / css/Noorderzon.css" rel = "stylesheet" type = "text/css" / > < / head >

< body class = "oneColElsCtrHdr" >

< div id = "container" >
< div id = "header" >
< h1 > < / h1 >
<!-end #header--> < / div >
< div id = "mainContent" >
< div id = "nav" > < a href = "#" title = "Home" > home < /a > | < a href = "#" title = "Biography" > < /a > biography | < a href = "#" title = "News & amp; Updates"> News & amp; Updates < /a > | < a href = "#" title = "Gallery" > Gallery < /a > | < a href = "#" title = "Work portfolio" > portfolio work < /a > | < a href = "#" title = 'Links' > links < /a > | < a href = "#" title = "Contact" > Contact < /a > < / div >
Main content < p > < /p >
< p > Lorem ipsum dolor sit amet, adipiscing elit our. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Amongst ornare risus quis ligula. P < /p >
< h2 > < / h2 >
< p > < / p >
< / div >
< div id = "footer" >
< p > < / p >
<!-end #footer--> < / div >
<!-end #container--> < / div >
< / body >
< / html >

And this is the CSS code:

@charset "utf-8";
{body
padding: 0;
text-align: center; / * This centers the container in IE 5 * browsers. The text is then set left aligned by default in the #container selector * /.
Color: #000000;
do-family: Verdana, Arial, Helvetica, without serif.
do-size: 9pt;
background-color: #800000;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
left margin: auto;
height: 100%;
}
body, td, th {}
do-size: 9pt;
Color: #333;
}
/ * Tips for Elastic layouts
1. Since the elastic layouts overall size is based on the user's default font size, they are more unpredictable. Used correctly, they are also more accessible for those who need larger fonts given the length of the line remains proportionate.
2. sizing of the divs in this provision are based on 100% font size in the body element. If you decrease the overall size of the text by using a font size: 80% on the body element or the #container, remember that the complete provision will reduce proportionally. You can increase the widths of the divs to compensate for this.
3. If the sizing of fonts is changed in different quantities on each div instead of on the overall design (ie: #sidebar1 is a font size of 70% and #mainContent has a font size of 85%), this will change proportionally each of the overall size of divs. You can adjust the base on your final sizing of fonts.
*/
#container {}
Width: 100%;
text-align: center; / * This setting overrides the text-align: center on the body element. */
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
left margin: auto;
background-color: #800000;
padding-bottom: 0px;
Top: 0px;
Bottom: 0px;
height: 100%;
}
#header {}
Width: 960px;
padding-top: 0;
padding-bottom: 0;
height: 160px;
margin-right: auto;
left margin: auto;
background-color: #DDDDDD;
background-image: url (.. / images/header.jpg);
}
#header h1 {}
margin: 0; / * zero setting of the margin of the last element in the #header div tag will prevent the collapse of margin - inexplicable space between divs. If the div has a border around it, this isn't necessary, which also allows to avoid the collapse of margin * /.
padding: 10px 0; / * padding instead of margin will allow you to keep the edges of the div element * /.
}
#mainContent {}
Width: 960px;
margin-right: auto;
left margin: auto;
padding-top: 0;
padding-right: 0px;
padding-bottom: 0;
padding-left: 0px;
background-image: url (.. / images/mainbg.jpg);
height: 100%;
}

#nav {}
text-align: center;
margin-top: 0px;
do-family: Verdana, Arial, Helvetica, without serif.
do-size: 10pt;
Color: #000;
Police-weight: 700;
padding-top: 9px;
padding-bottom: 10px;
text-decoration: none;
background-image: url (.. / images/mainbg.jpg);
background-repeat: repeat;
Width: 960px;
}

#nav a {}
Background: #fff;
Color: #000;
text-decoration: none;
}

#nav a: active {}
Background: #fff;
color: #800000;
}

#nav a: hover {}
Background: #fff;
Color: #000;
do-size: 10pt;
padding-bottom: 2px;
border-bottom-width: 3px;
border-bottom-style: dotted;
border-bottom-color: #800000;
}
a: link {}
Color: #000;
}
a: hover {}
color: #800000;
}
a: active {}
color: #369;
}


a: visited {}
color: #369;
}
#footer {}
height: 100px;
Width: 100%;
padding-top: 0;
padding-bottom: 0;
background-image: url (.. / images/bottom.png);
margin-bottom: 0px;
Bottom: 0px;
position: fixed;
}

Glad to be of assistance.  You can mark this question as answered this.

Nancy O.
ALT-Web Design & Publishing
Web | Graphics | Print | Media specialists
http://ALT-Web.com/
http://Twitter.com/ALTWEB
http://ALT-Web.blogspot.com

Tags: Dreamweaver

Similar Questions

  • I like the tabs on the bottom, I've updated to v29 and now the tab is on top. How to get back them on the bottom?

    I check the parameter 'browser.tabs.onTop' and it was false. How can I get back on the bottom. 64-bit Windows 7

    There are some addons that render this feature.

    https://addons.Mozilla.org/en-us/Firefox/addon/classicthemerestorer/

    https://addons.Mozilla.org/en-us/Firefox/addon/tabs-on-bottom/

  • My taskbar is vertical on the right side of the screen. How can I place horizontally at the bottom of the screen?

    Original title: taskbar

    My taskbar is vertical on the right side of the screen. How can I place horizontally at the bottom of the screen?

    Right-click on the taskbar and make sure that lock the taskbar is not checked. Now click on taskbar and keep the left button of the mouse down and drag the mouse to the bottom of the screen - possibly the taskbar should move to the bottom of the screen. Right-click on the taskbar and make sure lock taskbar is checked

  • toolbar moved for some reason my toolbar that was on the bottom of my office is now on the left hand side if, how do I return it to the bottom of the screen?

    for some reason my toolbar that was on the bottom of my office is now on the left hand side if, how do I return it to the bottom of the screen?

    Hello

    Are you referring to the taskbar on the desktop?

    Click on an empty space on the taskbar, and then hold down the mouse button, dragging the taskbar to one of the four sides of the office. Once the taskbar where you want, release the mouse button.

    For your reference:
    http://Windows.Microsoft.com/en-us/Windows-Vista/unlock-and-move-the-taskbar


    How to move the taskbar from its default position Windows or put it back to its default position
    http://support.Microsoft.com/kb/253679

    Kind regards
    Afzal Taher
    Microsoft technical support engineer

  • How to disable / enable the url at the bottom of page?

    When I print a document the URL is printed at the bottom of page. How can I enable / disable that?

    I have a HP Envy 4500

    Hello @Ertmania,

    Welcome to the Forums of HP Support! I can't see when you print pages on the Internet you always get the URLS of the Web Pages at the bottom of the page. It is a simple and easy solution, please follow the steps below:

    1. open your Internet Explorer browser

    2. in the upper right corner, click on the option of the gear (settings)

    3. go to print and layout

    4. under the heading headers and footers of ensure that footers is empty

    I hope this helps!

    Thank you

  • instead of the lower left corner and I don't know how to put it back on the bottom

    Somehow, my son moved my taskbar to the bottom of the screen of my laptop on the left side of the screen. My STARTUP icon is now in the upper left corner instead of the bottom left corner and I don't know how to put it back on the bottom. How do come back on the bottom where it goes?

    Right-click on thew start button | Properties | Tab taskbar | Location of the taskbar on the screen. Back at bottom.
     
     
  • How to print a text at the bottom of the last page in oracle reports 10g

    Hi all

    How to print a text at the bottom of the last page of a report. If the last page have one or two lines I want to display text as totals at the bottom of the last page only.

    https://community.Oracle.com/thread/23276?start=60&TSTART=0

    Metalink document: 253881.1

    Topic: How to create a report with a frame only on the last Page to a location set

  • How to type vertical text from the bottom up with the right orientation for a graph?

    How to type vertical text from the bottom up with the right orientation for a graph?

    Hello! Below, I'll demonstrate how to have vertical text in two different ways.

    Example 1:

    1. below, I have a graph and want to label the vertical axis.

    Select the text tool, and then the Vertical text tool.

    2 with the vertical Type tool, I tap on my vertical label.

    3 with the move tool, then I can orient the text in a position desired, as shown in the examples below.

    If this isn't the desired orientation of the vertical type you would like. I have the example 2 below.

    Example 2:

    1. After typing my text vertically with the Vertical Type tool (in example 1), I want to move to a horizontal position. I can go up to the options panel and select the icon "show/hide text orientation", surrounded by below. It will pass the text back and forth between vertical and horizontal.

    2 after the passage of the text to be horizontal, I want to change the orientation of the text, so it is aligned with my vertical axis.  Go in Edit > transform > Rotate as shown below.

    3 you want to can Rotate the text as indicated below.

    4 text is not in the right position we want, so we have to move the text, as illustrated below. Press enter/return to perform the complete transformation.

    5. the text is shown below.

    Other links:

    Please post back with any questions,

    Janelle


  • How to display this checkbox at the bottom of table lines.

    Dear friends,

    I created a table and a checkbox element in this region.
    I want to display this item box after rows in a table.

    How to display this checkbox at the bottom of table lines.


    Thank you

    Hello

    OK, sorry.

    Place the checkbox element to declare and report change 'display point"for example"Page Template Body (2. (éléments ci-dessous le contenu de la région) ".

    Kind regards
    Jari

  • The top of page 2 appeared at the bottom of Page 1

    Top of page 2 is now appearing at the bottom of Page 1 and I can't seem to understand how to bring it to the appropriate page.  I searched on Google and he suggested starting point tool.  In order to better explain what is my problem... in Word (and the document has been created from a form; not a Word document) I would have used a page break.  Unable to find anything like that.

    Sorry for what a quesiton of novice.

    Yes even if they say that you can convert to a doessn can't word Document it keep the word line breaks and the line ends with a return.

    You must do some editting before you can reuse.

    Other applications (for Mac and can be the same for PC) who turns to the Office of the PDF document. I don ' know there if do it better:

    Nuance PDF Converter for Mac

    PDF2Office v6.0

    Solid PDF to Word

    Wondershare PDF Editor Pro

    They can do better.

    It would be actually better so have a backup to: text.

    This way when you open it in Word to automatically on formatting a Word Document if it was introduced, to a vacuum worrd Document.  You will always have to redo any design of forms.

  • Number exhibitor at the bottom of page

    Our model company requires that each note number exponent - not only in the body of the text, but in the note itself. Is there a way so that InDesign can make automatically exposing? I can do it manually, but I guess that there is a way for the numbers to be automatically exposed.

    I use CS4 and am new with the program. I do not search the forum, but the only related responses did not say how to apply it to the number in the reference area, only the number in the body of the text.

    I was going to say that it was quite easy, but actually turned out be super easy!

    I'll assume you have a paragraph reference style dedicated - you don't want your notes to resemble your text.

    1. In this paragraph style definition, call the GREP Style Panel.
    2. Click on the button 'New GREP Style'
    3. A new item will appear in the GREP list; Click on the text [no] next to "Apply a Style" - it's actually a drop-down list.
    4. If you already have a character with just exposing style, you can select it here. otherwise, first make a by choosing "new character Style...". "downstairs, name it 'exposing' and have it only apply"exposing ".
    5. Click in the field next to "text" - its default value is '\d+', which means that the style would be applied to all numbers. Now tended to want to be exhibitor numbers, but... not all in the entire note! So, you'll have to imagine a way "only apply to numbers that are at the beginning of the note"... (which is, in fact, quite possible! And I'd be a Jongware happy to tell you how to remove this particular thing - but I digress. Sorry). The "super-easy" is because if you the do try to use '\d+', all the numbers at the bottom of page will be Exhibitor except reference numbers themselves! So why the "super easy"? Reference numbers have a unique code that is clean, so InDesign can follow and update when you insert or remove a note; GREP code for these is "~ F". So just delete the text that is in the 'text to' field and enter "~ F" inside (you mind, without the quotes - those who are just to indicate here the text to be inserted is just "~ F".) Oh Lordy now I did once again. No quotes needed).

    ... and all that's left for the Point #6 is to click OK to close the paragraph definition.

    There you go: reference numbers superior automagic.

  • How can you get rid of the "new tab" page that flashes what you did recently? I don't like this option...

    How can you get rid of the "new tab" page that flashes what you did recently? I don't like this option. If I wanted to Flash all the pages I've visited, I would. It is not YOUR place to do it for me. I'll change the browser if it is not changed.

    Hello, please refer to customize the page new tab to turn off the function.

  • What is the orange dot on the bottom of page average smiley face?

    What is the orange dot on the bottom of page average smiley face?

    Is this orange dot on the smiley thing in the instant message box

  • I created a form to complete 4 page. I would like to place a button at the bottom of page 4 when you click inserts another copy of the form in the existing file. I have the user to have the ability to easily create muliple copies of the same 4 pages in

    I created a form to complete 4 page in Acrobat. I would like to place a button at the bottom of page 4 when you click inserts another copy of the form in the existing file. I want the user to have the ability to easily create multiple copies of the same 4 pages in a single file. It is possible with Acrobat? I use a PC.

    It is possible using models and JavaScript, but if it is to work with the player, users will need to use the desktop version (Windows/Mac) of 11 Reader or CD player. Here is a link to an older article which explains the basics: Planet PDF - a lesson in the templates for Adobe Acrobat

    Note that this is a bit outdated, but it should help you get started. If you have any other questions, post them in the Acrobat JavaScript here forum: JavaScript

  • Buttons in white box... should have the bottom of page

    I'm new to the fireworks. Create a navigation bar with buttons. Canvas value transparant, as also the buttons in the up state.
    After the export and import of Dreamweaver. The navigation bar is white, although I expected the bottom of page to ' shine through. I can't to canvas of the same color as the page background, since the background is a gradient...
    What I am doing wrong?
    TNX for any help.
    Hugo

    Open your navigation bar, and then go to file > preview image. Select the export option 'GIF '. Select the eyedropper on the lower left corner and click the color you want to be transparent (probably white) in your illustration.

    Click export at the bottom and and you should be in good shape!

Maybe you are looking for

  • How do I know if I have viruses / whatever

    It seems that 'my computer' is send emails since, apparently, sent my items... to those who who do not have them.   How to stop this... or if I have a virus / whatever?  Also send emails to myself with nothing else than a "zip" attached file?

  • AMD high definition Audio Device not Plugged In (HP Pavilion dv6-6b09sa)

    I just started my laptop HP Pavilion dv6-6b09sa (running on Windows 7) to find that the sound icon is a red cross next to him and he claims that "no speakers or headphones are connected. In Control Panel, it says that the AMD high definition Audio De

  • Buy new Imac tips?

    Back just from the genius bar and the verdict is in: my faithful Imac hard drive 2008 is a failure.  It works always kind, but after using the machine for a while, I get the endless beach ball and just slows down to a crawl. So, I think to buy a new

  • Reinstalling Windows with the new hard drive - model: E1-571-33124G50Mnks

    I'm going to buy a new hard drive for my laptop because the disk hard was broken and must be replaced, if I put a new hard drive and install windows will I also need to install any drivers, BIOS/hardware and launch of applicationos? Thanks in advance

  • LaserJet pro M 125A: parse error

    I need to install the product. I can't use the scanner. Here is the error I get. pls help!