Solved

div is centered in Dreamweaver but not in browsers...??

Posted on 2012-03-22
6
333 Views
Last Modified: 2012-03-23
Hello,

I am using a method I have used before to center divs.  It shows up as centered in dreamweaver, but not in Safari or Firefox......code snippet below:

<div id="bigwrapperDiv">
<form method="get" action="" class="asholder" id="myForm" name="myForm">
<div id="headerDiv">
  <p><small style="float:left">
    <input   id="thisid"   value="0" style="font-size: 10px; width: 30px;" disabled="disabled" />
    </small><small style="float:left">
      <input type="hidden" id="isTest"   value="" style="font-size: 10px; width: 30px;" disabled="disabled" />
    </small>
    <small style="float:left">
      <input type="hidden" id="currentScore"   value="" style="font-size: 10px; width: 30px;" disabled="disabled" />
    </small><span class="contactinfo"><small style="float:left">
    <input   id="evaluatorid"   value="" style="font-size: 10px; width: 30px;" disabled="disabled" />
    <input   id="searchByWhat"   value="1" style="font-size: 10px; width: 30px;" disabled="disabled" />
    <input   id="currentSelect"   value="" style="font-size: 10px; width: 80px;" disabled="disabled" />
    </small></span><br />
  </p>
  </div>
</form>
<div id="mainContent" class="headerDiv">
  </div>
</div>

Open in new window

and CSS....
#bigwrapperDiv {width: 969px; margin:0 auto;overflow:hidden; padding-top:40px;}
#headerDiv {width:969px;border: 1px solid black;overflow:hidden;}

Open in new window


Thanks in advance for any help!

Cheers!
0
Comment
Question by:cougarsy
  • 3
  • 2
6 Comments
 
LVL 30

Expert Comment

by:LZ1
ID: 37753074
First of all, please NEVER use Dreamweaver "design" view to test any type of code. Always use the browser.  

Second: What are you trying to center? The bigwrapperDiv is centered for me.  You've given it a width as well as margin:0 auto which centers it within the browser.

Can you show a screenshot or maybe a live URL of the issue?
0
 

Author Comment

by:cougarsy
ID: 37753291
Hi and thanks for your quick reply.  Here is a link to a page that is not centering correctly:

http://www.infocuseurope.com/Dashboard/CENTERSAMPLE.ASP

The code is a bit of a mess, but it is a sample to show what I am trying to center.

Thanks!

Cheers!
0
 
LVL 30

Assisted Solution

by:LZ1
LZ1 earned 150 total points
ID: 37753306
You have a position:absolute on the body tag

Line 8 on this file: http://www.infocuseurope.com/css/autosuggest_inquisitor.css

Kill that and all will be good
0
Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 

Author Comment

by:cougarsy
ID: 37753330
Thank you so much!  I cannot make the changes now, but will do so in a couple hours and get back to you!!!

Cheers!
0
 
LVL 17

Accepted Solution

by:
nanharbison earned 350 total points
ID: 37753613
You also have several of these: float:left
0
 

Author Closing Comment

by:cougarsy
ID: 37756152
I split the points because LZ1 pointed out valid points that I felt were helpful in implementing best practices for my page.  However, the real 'fix' for me was nanharbison's solution of removing the 'float:left'.

Many thanks to you both!

Cheers!
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
How to use question mark (?) in filename with html 25 73
Else condition 9 23
Javascript Urgent help (Need help to disable event handler) 8 43
CSS Style Effect 2 10
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

829 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