Tag DIV, when the height is set to 'AUTO' is not automatic?

So basically the main DIV tag (#wrapper) is a grey box, in that I want everything on the page to enter.

When I put his height manually, for example 1020px, it works fine.

But when I put it on 'auto' it has a height of about 10px or so, starting at the top.

Can someone tell me why this is?

Here is my code:

< ! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional / / IN" "http://www.w3.org/TR/html4/loose.dtd" > ""

< html >

< head >

< meta http-equiv = "Content-Type" content = text/html"; Charset = UTF-8 ">"

< title > < /title >

< style type = "text/css" >

{body

background-color: #262626;

}

{#wrapper}

width: 1020px;

margin-right: auto;

left margin: auto;

background-color: #333;

padding-top: 10px;

padding-right: 10px;

padding-left: 10px;

height: auto;

}

{#logoFrame}

float: left;

width: 220px;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #6B 8431;

height: 360px;

padding-bottom: 10px;

}

{#titleFrame}

float: right;

width: 800px;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #6B 8431;

height: 360px;

padding-bottom: 10px;

}

#logo {}

float: left;

height: 360px;

width: 200px;

}

#title {}

height: 360px;

width: 780px;

float: right;

}

{#titleTopFrame}

float: right;

height: 233.5px;

width: 780px;

border: 1px solid #6B 8431;

}

{#sidebarFrame}

width: 220px;

border-right-width: 1px;

border-right-style: solid;

border-right-color: #6B 8431;

padding-top: 10px;

float: left;

height: auto;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #6B 8431;

padding-bottom: 343px;

}

{#footerFrame}

width: 1020px;

float: left;

margin-top:-10px;

}

{#contentFrame}

float: right;

width: 775px;

padding-right: 10px;

height: auto;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #6B 8431;

padding-left: 14px;

}

{p}

are-family: "Lucida Sans Unicode", "Lucida Grande", without serif.

color: #D6D795;

-tracking: 0.01em;

text-align: justify;

}

{#pictureFrame}

float: right;

height: 383px;

width: 289px;

top of the margin: 23px;

margin-bottom: 10px;

margin-left: 10px;

}

#image {}

height: 383px;

width: auto;

float: right;

}

H6 {}

color: #797979;

are-family: "Lucida Sans Unicode", "Lucida Grande", without serif.

are-size: 11px;

make-weight: lighter;

text-transform: uppercase;

text-align: center;

}

{#titleBottom}

width: 780px;

float: right;

height: 110px;

}

< / style >

< script src = "SpryAssets/SpryMenuBar.js" type = "text/javascript" > < / script > "

< link href = "SpryAssets/SpryMenuBarVertical.css" rel = "stylesheet" type = "text/css" > "

< / head >

< body >

< div id = 'wrapper' >

< div id = "logoFrame" > < img src = "Header/Logo.png" alt = "Logo" width = "335" height = "632" id = "logo" > < / div > "

< div id = "titleFrame" >

< div id = "titleTopFrame" > < img src = "Header/Title.png" alt = "Title" width = "1112" height = "500" id = "title" > < / div > < / div > "

< div id = "sidebarFrame" >

< ul id = "MenuBar1" class = "MenuBarVertical" >

< li > < a href = "#" > home < /a > < /li >

< li > < a href = "#" > on < /a > < /li >

< li > < a href = "#" > subject Tim < /a > < /li >

< li > < a href = "#" > Types of walls of retaining < /a > < /li >

< li > < a href = "#" > Gallery < /a > < /li >

< li > < a href = "#" class = "MenuBarItemSubmenu" > < /a > Reccomendations

< ul >

< li > < a href = "#" > block factory < /a > < /li >

< li > < a href = "#" > civil engineers < /a > < /li >

< li > < a href = "#" > geogrid factory < /a > < /li >

< li > < a href = "#" > engineers geotechnical < /a > < /li >

< li > < a href = "#" > wall installers < /a > < /li >

< /ul >

< /li >

< li > < a href = "#" > stories < /a > < /li >

< li > < a href = "#" > Contact < /a > < /li >

< /ul >

< / div >

< div id = "contentFrame" >

< div id = "pictureFrame" > < img src = ' Pages/3. On Tim/Tim Headshot.jpg' alt = 'Tim' width = "525" height = "700" id = "image" > < / div >

paragraph < p > < /p >

< / div >

< div id = "footerFrame" >

< h6 > < strong > to < > 2011 facilities by I wish I had a company name, Inc. < / h6 >

< / div >

< / div >

< script type = "text/javascript" >

var MenuBar1 = new Spry.Widget.MenuBar ("MenuBar1", {imgRight: SpryAssets/SpryMenuBarRightHover.gif"}" ");

< /script >

< / body >

< / html >

Sorry I know this is a bit long. I have put all the "#wrapper" - of the snippets in red.

Can someone tell me why this is?

Of course, it's because a) auto is the same as nothing.  This means that the default behavior for a block tag is to expand vertically to wrap its content.  The problem arises when / if some of the content are launched or positioned.  As floated and positioned elements are "withdrawn from normal traffic" page, acts of container as if they were not there yet and only reacts to the content not launched, ignoring the other two elements.  Given that you have floating content in the tank of #wrapper, this is what is happening.

There are four ways to force a container to encapsulate floating elements:

1. the float container

2. Add an element of compensation immediately before closing the container

3. apply a style to the container that forces him to become a new block formatting context.  These styles are things like -

overflow: hidden. scroll | Auto

Display: inline-block. Inline-table | table-cell. table-caption

position: absolute. fixed

4. use an adaptation of CSS clearfix

The most common (but not without a few problems) to do this is to use overflow: hidden style.  Try changing your div wrapper to this and see what happens-

Tags: Dreamweaver

Similar Questions

  • Quickly and easily adjust levels dB precisely when the heights of low audio clip using?

    Unless I use a height high enough audio clip, it is extremely tedious to achieve a specific level of dB.

    Is it possible to almost instantly making it easy to slip accurately when the height of the clamp is gray low?

    I know that I can in. the volume up and down by using ctrl - and ctrl = but when I do that I see not reassuring display of the confirmation of the dB level.

    Is it possible to this thumb upward or down while seeing the dB display?

    Ian, if you open the Audio pane of the Inspector and use these keyboard shortcuts to adjust, you see move the volume slider and DB digitally edit to the right of the cursor.

    Russ

    Edit: Insert the volume

  • 4200 exempts no paper when the tiroir2 is set to standard

    Hello

    I have LaserJet 4200, which raises the paper when the selector on tray 2 is in the custom position, but does not throw when the selector is set to Standard. From what I see when you switch selector in Standard or custom, the only difference is the three bars in plastic on the side of the status bar engaged three contacts in the printer when the tray is in. When the tray is in Standard mode, only the contact in the middle is engaged.

    I'm not sure if it's the average contact in the printer that is inoperable, or maybe the coil in the engine of the elevator that is connected to the central contact. And I can't find anything on the replacement of the elevator tray 2 on the web engine.

    Help, please.

    Thank you.

    For the printer, I pulled the tiroir2 out and played with the contacts of three tray on the side of the printer, by pushing brake, he seems to have an effect of resetting this switch, and so far it raises the tray very well...

  • Push leads to SFDC when the contact opens an email but has not clicked

    Hello world

    I have to push leads to SFDC when the contact opens an email but has not clicked. I have a program generator that updates the CRM. How my canvas campaign looks like so I can push should conduit who opened an email but fact not clicked and dimension as 'Normal '? Should I create another program for this generator? Thank you!

    OK, looking at your detailed requirement, I think it's more that just to have two separate lists because you will also need to update contact record to see who has clicked and opened etc... (unless someone of other comments on this subject and provides a simple solution here).

    I suggest you explore approach to lead scoring. I think it would be much better option to have to go through sharing lists / route filters.

    Top scoring model, you can define the criteria of open clicks vs and give them scores... In the future, you can add additional criteria too for example if the person has submitted a form, visited a web page or a landing page of Elqoua etc. For each criterion, you can set specific scores... You can find information about the partitions of lead here... Eloqua10 drive rating Resource Center (there may be more available resources, so research topliners).

    It may take time for you if you are not familiar with the notation of lead but will future proof solution.

    If it helps at all then the way we manage click and opens with a form blind on the clicks... so whenever the user clicks on a link in the email they are passed through a form unknown / hidden and on the form, there is normally a specific value that identifies them as users click to get these users to SFDC straight on a daily basis.
    Then opens (excluding clicks) is learned separately and we normally and loaded separately (depending on budgets of telemarketing etc.). Having said that we are also developing implementing lead scoring model.

    I hope this helps.

    PS: on your question about food... Yes, it is basically adding members to a step... using the charger, you can automate the process. You can find create option charger at the top right in the program (as members).

  • All the Muse slideshow set to Auto play do not restart if suspended! Jinx

    All the Muse slideshow set to Auto play do not restart if suspended! Jinx

    Slideshows of auto playback can only be interrupted when a trigger or the Prev / next icon is clicked. And once paused, the page must be reloaded so that the feature of AutoPlay slideshow for re - initialize. Feel free to add an idea to our ideas section.

    Thank you

    Vinayak

  • ArcSoft PhotoImpression 6 - when the dvd is in fact I can not play the television-says damaged disc

    When the dvd is in fact I can not play the television-says damaged disc. But he plays on the computer. I want to play on television.  Also I have a number of pictures on this program in the files and want to sort by number. = How do I do?

    Perhaps you should ask to Arcsoft?

  • Adding new tags div for the placement of banner ads

    Hello

    I try to add new tags div for advertising banners to the left and to the right of the page inside my container and cannot find a way to position them. I modified a screenshot below to show where I want what they (they are just the layers in photoshop, I created). I have not create the page and I'm lost. Is it a matter of "splitting" the existing divs in the doc?

    I added a padding to create the space to the left, but I don't think it was the way to go...

    Thanks a ton for the help on this one!

    example.jpg

    It is a model that you bought... you don't have the real layout yourself?

    There are a ton of nested

    It's in there, used for background images... I really have no idea why so much! I would use maybe some background images and called it good. In any case, now you will need to get around all those nested
    s.

    The area on the left is because of the 150 px of padding in

    .

    To make this available space, you need to delete this padding and use two floating elements instead of just the single item that is there now.

    I suggest you to test how the CSS box model works, as well as how to 'float' part. Then, you will be able to align two or more containers

    s side by side.

    http://www.w3schools.com/CSS/css_boxmodel.asp

    http://www.w3schools.com/CSS/css_float.asp

    You can have a better learning experience if you start off very simple... on a blank Web page, work in code view and place 4

    s, use the first
    Autour and contain the other 3. Then place these 3 side by side. Give each a width, height and a different background color so you can see where and how they line up when we. Play with it a bit until you understand how floats work... then to tackle your Web pages.

    Best wishes

    Adninjastrator

  • Screen do not maximize mode full-screen when the taskbar is set to hide

    original title: Gap Auto-Hide

    I put my tool bar to auto hide. Normally, a zoomed window will extend to the bottom of the screen when the task bar is hidden. However, whenever I restart Windows, any window that is maximized will only go down insofar as space of the taskbar visible again, even when it is hidden. Turning auto-hide and the new set, but only until that next time that I reboot. Is there a way to fix it permanently? I use XP Pro.

    The problem I have is happening with any program that I open, not only IE and windows, then I would say it's more a problem of Windows.

    I don't think that was said in the original post.

    Check you the Technet Forum - they are the best service.

    http://social.technet.Microsoft.com/forums/en-us/itprovistadesktopui/thread/4aa71ed5-3500-4d11-A461-7d80c0847f91/

  • Will HP WI - FI no pickup when the router is set to 5.0 Ghz

    HP Office Jet Pro 8600 will not collect wi - fi when having Modem/Router set to 5.0 Ghz, works only on 2.4 Ghz.

    Y at - it an update of the HP driver that will fix this problem?

    N °

    HP printers don't support 5 GHz wireless frequency but only 2.4 GHz.

    You can set your router to broadcust one two frequencies (Dual Band), then connect the printer to the range 2.4 GHz SSID.

    All HP printers that support 802.11n use 2.4GHz only.
    http://www8.hp.com/us/en/campaigns/wireless-printing-center/wireless-network-help.html
    

    Shlomi

  • in the design mode layers are moving downwards when the height of the page gets larger?

    Hello World)

    Could someone please advice me how can I stop the layers and groups to move when I'm changing the height of the page. Even if I block them, they spend when I change the height of the page.

    Is this a bug or how to get rid of this effect?

    Thank you)

    Hello

    It depends on the content that you have placed in your Muse site and how it is placed in the site.

    For a more in-depth analysis, we would have to look at your site and its content.

    Kind regards

    Akshay

  • How to use a working repository when the type is set to 'run '?

    Hi all
    I was trying my hand just import and export standards of work, I need to know how we can use a certain repository of work when its type is set to "run".
    I want to import some packages (which are in any other custodian work) in this repository of work but I'm missing something somewhere.
    Can someone tell me what are the exact steps to import packages or repository in this work newly created repository 'Exécution' type?

    Kind regards.

    Hello

    A working repository which is of type EXECUTION cannot be used to import packages/interfaces etc.

    You can able to import only the SCENARIOS in component operator (tabbed scenarios) and run 'just '. In the execution of the term repository State, you can able to run objects created in the development repository.

    In addition, u cannot access designer itself if it is a repository of EXECUTION.

    Thank you
    Guru

  • The use of JavaScript to extend the height of a DIV at the height of a document or a page.

    Hi all

    How to use JavaScript to dynamically resize a DIV on a page, so that the div extends vertically to the size of the page or document.

    I did experiences throughout the evening with different methods, some do not work yet.

    Thank you all!

    WE

    This question is asked several times a week.

    SAME HEIGHT CSS COLUMNS

    Option 1. Start the project with equal height CSS Layout
         http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-CSS-no-hacks

    Option 2. Use the Faux column method (vertical tiled background image)
         http://forums.Adobe.com/message/2653416#2653416

    Option 3. Use of JavaScript
         http://www.Projectseven.com/Tutorials/CSS/pvii_columns/index.htm

    Each solution has advantages and disadvantages.  Use the one that best meets your needs.

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

  • I can't get the STOP button to appear in the Navigation bar, even after going through the suggestions; It will appear when the Restore Default Set window is open, but disappears as soon as a click on

    The X to STOP loading the page does not appear in the Navigation toolbar. If I right-click, select Customize, restore the default value, it is displayed; Click done and it disappears. I disabled the theme; disabled all extensions; reset the toolbar and commands; disabled acceleration. No luck.

    From Firefox 4, the Go, the buttons Stop and reload are combined into a single button at the right end of the toolbar URL or address. The button changes depending on the type of activity:

    • green arrow GB when you type in the address bar
    • Red Stop ("X") button while the page is loading
    • Reload (circular arrow) to gray when the page is finished loading.

    There are separate buttons:

    1. Open the Customize the toolbar by clicking the Firefox button > Option > toolbars OR by clicking View > toolbars > customize if using the menu OR bar right click in an empty space on a toolbar and select Customize
    2. Stop and Reload buttons will show separate from the address bar and the search bar
    3. Drag the buttons anywhere on the Navigation toolbar
      • order Reload-Stop will bring together into a single button
      • order Stop-Reload will remain in separate keys
      • or drag a "separator" in the window customize between Reload-Stop and that they remain separated
    4. Click done at the bottom right of the window customize to finish

    If this answer solved your problem, please click 'Solved It' next to this response when connected to the forum.

    You have several older versions of Java installed Console Java did not clean up when updating. Your old versions are: 6.0.16, 6.0.22

    Follow these instructions to remove older versions: http://kb.mozillazine.org/Java#Multiple_Java_Console_extensions

  • CreateInsert-button in the form element, when the local is set Arabic "ar".

    The component CreateInsert - shaped button does not work when the Faces local is defined Arabic "ar".

    it s not clear the form field, but you can enter your data and successfully engage.

    It's the lock like a bug in the faces, is?

    and how to fix it, or clear form fields?

    I created the new application in JDev 12.1.3 and I did the following:

    1 - Create the .jspx page

    2. drag this page VO data controls in the form of the ADF

    3 - Drage CreatInsert operation inside the VO of data in the form of button controls

    4 open faces - config.xml--> Application--> locale by default for "ar".

    5. start the application

    I test and it works very well. Is there anything else that you have done?

  • selected track when the playback head sets

    For a specific project, when the playhead is moved or a brand of sequence is created, a video track is selected. To continue to create brands of sequence, deselect the tracks every time.  Very annoying. Cannot find all the parameters a/c for that. Does not occur in other projects.

    Help.

    Thank you.

    Go to the menu sequence and toggle the selection follows playhead.

    MtD

Maybe you are looking for

  • cannot access emails

    In the Inbox, I have the list of incoming mail, but cannot access the window below.  The up arrow will not be life to display emails.  Will not catch this.  What can I do else? Thanks, Tzipora

  • palmOne tungsten e2

    How can I recover the files of addresses? They disappeared from my computer. Device is supported, but my concern is what is on my computer, not what is in the camera. When it is charged I'll do a hotsync - but why the files disappear?

  • Apple's music has hidden my music on my iPhone.

    I got a trial of Apple's music and found that for my choice of praise and Gospel music that he kept to push myself listening to rock, pop, and that it has not respected my choice. I always use Spotify and pay student - music Apple is too expensive an

  • View via webcam is upside down.

    The Viewer on my webcam shows picture upside down, and I can't find a way to return to the correct way round. Can anyone help? My operating system is windows Vista

  • Login problem there is only one user on this computer

    When I try to login, I get this message- Your system is low on resources. You cannot open a session as a new user. Please use an account that has already been noted on