DIV not displaying properly, half way down page?!

Hey Guys
Really can't work this out. My code is below. I've also affixed a screenshot of what happens. The DIV no matter what you use, <p>, <h1> etc... It will display half way down the page! I've also affixed my CSS document for you to look at. I've tried deleting the slider JavaScript and CSS from the page with no results so I know it's not this. And yes, my code probably isn't the best way of doing things, tips appreciated as still learning!
<!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>From Me To You Removals - Removals in Sheffield</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
          
          <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
          <script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
          
          <style>
          #slider { width: 1100px; height: 300px; }
          </style>
          
          <link rel="stylesheet" href="css/anythingslider.css">
          <script src="js/jquery.anythingslider.js"></script>
          
          <script>
                    $(function(){
                    $('#slider').anythingSlider({
                    autoPlay: true
          </script>
</head>
<div id="container">
          <div id="title">
    <a href="https://www.facebook.com/pages/From-Me-To-You-Removals/324845494227068" target="_blank">
                    <img class="facebook" src="images/facebook.png" alt="Removals in Sheffield Facebook" />
    </a>
    <a href="https://twitter.com/intent/user?screen_name=PhilipSue" target="_blank">
        <img class="twitter" src="images/twitter.png" alt="Removals in Sheffield Twitter" />
    </a>
          </div>
          <div id="menu">
    <ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="reviews.html">Our Reviews</a></li>
    <li><a href="services.html">Services</a></li>
    <li><a href="storage.html">Storage</a></li>
    <li><a href="packnmove.html">Pack and Move</a></li>
    <li><a href="contact.php">Contact</a></li>
    </ul>
    <br style="clear:left;" />
    </div>
    <div id="headerslider">
                       <ul id="slider">
                              <li><iframe width="1100" height="300" src="http://www.youtube.com/embed/HaqKUrevPuU" frameborder="0" allowfullscreen></iframe></li>
                              <li><img src="images/slider/scap.jpg" alt="Friendly Service"></li>
                              <li><img src="images/slider/1.jpg" alt="Removal Vans"></li>
                              <li><img src="images/slider/2.jpg" alt="Removal Vans"></li>
                              <li><img src="images/slider/3.jpg" alt="Removal Vans"></li>
                              <li><img src="images/slider/4.jpg" alt="Removal Vans"></li>
                    </ul>
    </div>
    <div id="boxes">
                    <div id="boxxy">
        <h2>Removals</h2>
        <p>We have over 40 years of experience in the removals business. With our services, you can be sure that the job will get done in both a professional and friendly manner and make your removal hassle free!</p>
        <img src="images/readmore.png" />
        </div>
        <div id="boxxyq">
        <h2>Storage</h2>
        <p>We can provide storage for your goods if you don't have a place to move them to. We have very good rates on our storage and can always find a facility to suit you! If you need storage for your goods, please <a href="contact.html">contact us</a>.</p>
        <img src="images/readmore.png" />
        </div>
        <div id="boxxyz">
        <h2>Packaging</h2>
        <p>We provide a professional packaging service, and we will pack <b>ALL</b> your goods for you! All materials supplied and handled with care! With this service you can have your items packed, moved, and even unpacked in your new home!</p>
        <img src="images/readmore.png" />
        </div>
           </div>
    <div id="content">
                    <p>Removals in Sheffield</p>
    </div>
</div>
<body>
</body>
</html>
@charset "utf-8";
/* CSS Document */
body
          margin: 25px 0px; padding: 0px;
          text-align: center;
          background-color: #E2BD93;
          background-image: url(../images/bgbody.jpg);
          background-repeat: repeat:
#container
          width: 1100px;;
          height: 1400px;
          margin: 0px auto;
          text-align: left;
          padding: 15px;
          border: 1px dashed #333;
          background-color: #800000;
#title
          width: 1100px;
          height: 160px;
          background-image: url(../images/logo.png);
          background-repeat: no-repeat;
          background-position: left;
          background-color: #800000;
.facebook
          float: right;
          margin-right: 10px;
          margin-top: 10px;
          padding-right: 40px;
.twitter
          float: right;
          margin-right: 5px;
          margin-top: 10px;
#menu
          width: 1100px;
          margin-left: 200px;
          padding-bottom: 15px;
          color: #fff;
          font-family: arial, helvetica, sans-serif;
          white-space: nowrap;
          list-style-type: none;
          align: center;
#menu li
          display: inline;
#menu li a
          padding: 0.2em 1em;
          background: #fc6;
          color: #000;
          text-decoration: none;
          float: left;
          border: 1px solid #000;
#menu li a:hover
          background: #08c;
          color: #fff;
#headerslider
          width: 1100px;
          height: 300px;
#boxes
          text-align: left;
          width: 1100px;;
          height: 600px;
          padding-left: 15px;
          padding-top: 50px;
div#boxxy
          margin-left: 8px;
          width: 31%;
          height: 225px;
          float: left;
          margin-right: 10px;
          background-color: #800000;
          border-style: inset;
          border-color: #C60;
          background-image: url(../images/bgbody.jpg);
          background-repeat: repeat;
div#boxxyq
          width: 31%;
          height: 225px;
          float: left;
          margin-right: 10px;
          background-color: #800000;
          border-style: inset;
          border-color: #C60;
          background-image: url(../images/bgbody.jpg);
          background-repeat: repeat;
div#boxxyz
          width: 31%;
          height: 225px;
          float: left;
          background-color: #800000;
          clear: none;
          border-style: inset;
          border-color: #C60;
          background-image: url(../images/bgbody.jpg);
          background-repeat: repeat;
div#boxes h2
          padding-left: 15px;
          color: #C30;
div#boxes p
          padding-left: 15px;
          padding-right: 15px;
div#boxes img
          float: right;
          padding-right: 20px;
div#content
          margin-top: 0px auto;
#footer
          width: 1100px;;
          height: 100px;
Screenshot: http://i.imgur.com/jHxH1.jpg
MANY THANKS! I appreciate your time!

Height is not your friend. The page/container height is always determined by the content inside it. So adding explicit height values will often cause more pain than gain.   Suggest you start by removing all the height properties.
Also, I don't see where you have cleared any of your floats.   You need to learn to do that. Several methods available.
Option #1 Use a CSS clearing class:
               .clearing {clear:both; display:block; visibility:hidden}
Insert this HTML after your floated boxes:
               <hr class="clearing" />
Other options: Float Tutorials
http://css.maxdesign.com.au/floatutorial/
Magic of Overflow:hidden
http://colinaarts.com/articles/the-magic-of-overflow-hidden/
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Similar Messages

Print problem. trying to print a document in Preview, the start of the text prints half way down the page not at the top of the page?

Print problems. Printing out an email the text starts half way down the page. I tried taking a picture of the text I wanted to print, tried to print from Preview and have the same problem. If anyone has any ideas I would really apreciate it. Thanks Penny

One more thing to check: System Preferences/Print & Scan. Make sure your printer is set as Default.
I'm using OS X 10.8 and I don't see Page Setup anymore. If you have access to Page Setup, check to see if there are any adjustments to make there.

Web page not displaying properly - content in wrong place

It's been years since I've done html and this is the first time using Dreamweaver. All my pages have the same header then a horizontal row of link buttons. I have used Divs to create 3 sections of content underneath this. Each div has the following defined for it: #Div { position:absolute; width:913px; height:440px; z-index:1; left: 10px; top: 302px; My main page is not displaying properly. There is a section on the left with text/photo. To the right of this section, there is a second div containing an image map. In Dreamweaver, I preview the page (using Chrome) and it looks fine. However, when I upload it to the web site and then view that page in the web site, the second div is thrown to the upper top right of the page. I do not know what is causing this and how to fix it. Can anyone answer this and perhaps give me some tips?

Start by fixing your HTML errors. You have a significant number of them.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fgivethegaveltotavel.com%2F
Also, you have some CSS errors.
W3C CSS Validator results for http://givethegaveltotavel.com/ (CSS level 2.1)
Position:absolute is never a good way to layout your web pages. For 98% of what you do, positioning is not required and should be avoided. Learn to use CSS margins, padding and floats to align elements where desired.
CSS margin property.
CSS padding property
CSS Float
Nancy O.

Pages not displaying properly in Publisher instances as we activated the page from Author

HI All,
Pages not displaying properly in Publisher instances as we activated the page from Author. In author it is working well but in Pulisher it is showing first 2 lines of the page and then showing error as
Apache sling/2.2 Hot Spot ****** Sun OS error
Please help me on this.IS this issue with the templates or components are we using?

Ok, then let's go the long way and try to reduce the number of possible root causes:
1) Is your problem reproducible on this publish? (I suppose it is)
2) Is it reproducible on other publishs as well, which have received the same page with the same application?
3) Can you reproduce it on other replicated pages as well?
4) When you upload a page to such an affected publish via a content package, does this page render correctly?
5) Does this problem appear on other environments as well?
6) Do you use dispatcher when you get this result? Or do you get it when you request the page directly of CQ5?
7) What's the HTTP statuscode when you render this page? You can see it in the request.log of CQ5.
If you change logging via Felix Console, you don't need to restart the instance.
kind regards,
Jörg

Why do pages like natwest and ELC not display properly? It is like their text is too large, yet other pages are fine?

I have abrand new ASUS notebook with a 11 and a half inch screen. I have up to date Windows system, and am using the latest version of firefox. I have gone through all the tips in the help section of firefox including clearing cache and cookies, and also checking all settings for text, however none of this has corrected the problem. For example when i log into my online banking the text is that big it doesnt fit into the boxes set on natwest screen, so therefore i can view all of the text and it gets jumbled together in some places. With ELC a good example is the menu across the top of the page which gives all of the categories of products they sell for you to click on. As the writing is too large it does not display properly. Im not sure what else to do to crrect this. Can anyone help?

Try 2 things, if they can help:
1. on the same window, where you have 1 of above site opened. Do ctrl + F5.
2. Do Ctrl + shift + P, it will open a new private window and browse any of the above site.

Page does not display properly in 3.0.4

If someone from apple reads these postings, the following page does not display properly in Safari 3.0.4 with mac os leopard.
I can not find an email to email directly to you.
http://bigten.cstv.com/sports/m-wrestl/spec-rel/021308aab.html

Hi
Welcome to Apple Discussions
Best way to reach Apple is to send a Bug Report via the Safari Menu>Report Bugs to Apple. While Apple doesn't respond directly to these notes, the information gets in the hands of Software Engineers at Cupertino.
Specific to the referenced site, there are multiple code errors, which would contribute to the rendering problem. Safari is a lot more specific about following correct code than other browsers. I suggest passing the Validation report on to the site developers. Good code practices (W3) makes for better uniformity and security on the Internet.

Page will not display properly with inline Frames

I have a html page that will not display properly in Dreamweaver. I have a basic understanding of html and want to be able to edit a website in Dreamweaver that was given to me. It looks fine in a browser, but in Dreamweaver some of the content is missing and displays the following message, "Your browser does not support inline frames or is currently configured not to display inline Frames". I was able to open it without any problems using Microsoft Front Page, so is it possible to view and edit it in Dreamweaver?

Without seeing your page, I'm guessing that your page contains server-side includes, iframes and scripts to other files on the server that populate page with content on the server's end. You can't see it in DW because you don't have all the files in your DW local site folder. You said this views fine in FP. Was your page created in FP with FP proprietary tools?
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb

View/Resolution/Font is incredibly small resulting in web pages not displaying properly (Facebook) & I can not find internet tools options or compatibility view otions

I've tried different things to adjust this problem on my laptop, but nothing is working. I uninstalled firefox because this was very irritating. I just reinstalled after being away for 2months and the problem still exists. My laptop settings are for normal display and font sizes and everything is normal when I use internet explorer, but when I use firefox...everything shrinks. When I'm on facebook using apps...it gets even smaller and app screens will not display properly. There is no internet options or compatibility view settings on this new firefox that I can find and I'm out of ideas on how to fix this.

See this: <br />
https://support.mozilla.com/en-US/kb/Page+Zoom
The Firefox Page Zoom feature does a domain by domain level of saving the users preferred zoom level settings, there is no default Page Zoom level setting in Firefox.
Try the Default FullZoom Level extension: <br />
https://addons.mozilla.org/en-US/firefox/addon/6965
Or the NoSquint extension: <br />
https://addons.mozilla.org/en-US/firefox/addon/2592/

Upgrade to ver 1.6 pages not displayed properly in Firefox

Hi,
I upgraded HTML DB to Ver. 1.6 today. The installation was okay, did not raise any errors, but when I use Firefox to log on to HTML DB, the pages are not displayed properly. IE is able to resolve the pages correctly.
Do I need to get a plug-in for Firefox? Ver. 1.5 was working perfectly with Firefox.
TIA

My design view won't display properly in Mozilla or IE. The images show. The CSS (core and flow) are found according to the access logs. But it doesn't display nicely at all. This was an upgrade from 1.5 to 1.6. 1.5 looked fine. My old applications from 1.5 display properly.

Pages are not displaying properly

Hi
I am using EP 7.0 SP 7.0. Some of the pages (like new ivew creartion page, Identity management page under User Administration etc.) are not displaying properly. The background is showing totally white and only the buttons and text are visible.
Though these pages were working fine before.
Is there any configuration change which is causing this?
Any suggestion ??????

Hi,
SAP recommends to use fully qualified domain names, when using the portal.
For example, to enter into the portal use "http://machine_name.company_name.com/irj/portal., instead of "http://machine_name/irj/portal".
Failing to do so may lead to inconsistency in communication on client side between the page and iViews.
Regards,
Srinivasan T
<b>helful answer=>points</b>

OLE Objects are not displayed properly-overlap characters and empty page

I'm using CR4E 12 Runtime libraries to load and view reports that are created in CR designer v10. Some of the OLE Objects (not all) are not displayed properly.
1) A full page contains terms and conditions as ole object is not at all displayed and just shown as black image.
2) Some data in a table (OLE Object) shown as overlapped characters.
Any body know the reason and is there any workaround to solve this issue?
Thankyou very much for your time.

Your problem seems to be with the character encoding you are using for your text. A quick google search for ColdFusion character encoding should turn up the answer. In case you are interested in learning more:
http://livedocs.adobe.com/coldfusion/7/htmldocs/wwhelp/wwhimpl/common/html/wwhelp.htm?cont ext=ColdFusion_Documentation&file=00001201.htm
Hope that helps!
- Michael

Logic midi notes not audible with pedal half way down

I'm using a roland rd700sx keyboard with a roland dp-8 damper pedal connected to a powerbook. recording midi works but when I have the damper pedal half way down the notes are there in logic but aren't audbile. Any tips on getting this working would be great as I have a deadline for a piano part I'm supposed to contribute for a project.
thanks

anyone?

Why is my youtube webpage not displaying properly?

My youtube webpage is not displaying properly. its like tthere is only text and thumbnails and the whle webpage is too damn long. The videos don't play when clicked. Problem on both firefox and chrome. I disabled kaspersky av but it didnt make any difference cuz i thought the firewall mustve been blocking something. check screenshot attached.

You can try these steps in case of issues with web pages:
You can reload web page(s) and bypass the cache to refresh possibly outdated or corrupted files.
*Hold down the Shift key and left-click the Reload button
*Press "Ctrl + F5" or press "Ctrl + Shift + R" (Windows,Linux)
*Press "Command + Shift + R" (Mac)
Clear the cache and remove cookies only from websites that cause problems.
"Clear the Cache":
*Firefox/Tools > Options > Advanced > Network > Cached Web Content: "Clear Now"
"Remove Cookies" from sites causing problems:
*Firefox/Tools > Options > Privacy > "Use custom settings for history" > Cookies: "Show Cookies"
Start Firefox in <u>[[Safe Mode|Safe Mode]]</u> to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem.
*Switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance
*Do NOT click the Reset button on the Safe Mode start window
*https://support.mozilla.org/kb/Safe+Mode
*https://support.mozilla.org/kb/Troubleshooting+extensions+and+themes

PDF not displaying properly in Acrotbat

Hi all,
I'm having an issue with a document I have created in Photoshop not displaying properly when opened in Acrobat. It is a brochure for my work, that I have worked on and printed many times. When I open it in Acrobat after creating the PDF, gaps appear and other elements are shifted out of place. When viewing it in Photoshop, those gaps are not there, even when I zoom in very close. When we open the file on other computers with Acrobat, the gaps are still there. To test the PDF further, I downloaded some free PDF viewers off the net and the document looks the way it was created, the way it should be. I don't know how to fix it and certainly don't want the gaps appearing when it goes to print. Any ideas on how to fix this? I've never previously had this problem. Thank you in advance for your help.
Leah

Without access to the files it's impossible for us to help. Acrobat will be displaying the PDF "correctly", but why the page contents are shifted is anyone's guess.
When you save as "Photoshop PDF" and choose the "Preserve Photoshop Editing Capabilities" option, it embeds a copy of the PSD file into the PDF and will open that whenever you try to open the PDF in Photoshop, which is why you don't get the import dialog. Photoshop never even reads the PDF page contents. Turn off that option, save to PDF again, and then open it in Photoshop - you'll see the true PDF page being imported as a graphic, and it'll match what Acrobat is displaying.

Hi my web hosting company irunsolutions.co.uk have informed me that my website does not display properly in firefox when run on a windows 7 32 bit platform.

website is www.empireembroidery.co.uk
does not display properly when viewed on 32bit windows 7 platform in firefox.

You can try these steps in case of issues with web pages:
Reload web page(s) and bypass the cache to refresh possibly outdated or corrupted files.
*Hold down the Shift key and left-click the Reload button
*Press "Ctrl + F5" or press "Ctrl + Shift + R" (Windows,Linux)
*Press "Command + Shift + R" (Mac)
Clear the cache and cookies only from websites that cause problems.
"Clear the Cache":
*Firefox/Tools > Options > Advanced > Network > Cached Web Content: "Clear Now"
"Remove Cookies" from sites causing problems:
*Firefox/Tools > Options > Privacy > Cookies: "Show Cookies"
Start Firefox in <u>[[Safe Mode|Safe Mode]]</u> to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem (switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance).
*Do NOT click the Reset button on the Safe Mode start window.
*https://support.mozilla.org/kb/Safe+Mode
*https://support.mozilla.org/kb/Troubleshooting+extensions+and+themes

DIV not displaying properly, half way down page?!

Similar Messages

Maybe you are looking for