473,402 Members | 2,064 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,402 software developers and data experts.

Div not starting at the top of page? [Firefox]

54
From some reason the entire webpage start about 5px from the top. I've margin:0 auto; the whole thing plus margin-top:0px; the whole thing too...

Expand|Select|Wrap|Line Numbers
  1. #container {
  2.     width: 700px;
  3.     font-family: serif;
  4.     font-size:14px;
  5.     color: #222222;
  6.     margin:0 auto;
  7.     border-left:solid 1px #333333;
  8.     border-right:solid 1px #333333;
  9.     margin-bottom:0px;
  10.     margin-top:0px;
  11. }
  12.  
  13. #wrapper {
  14.     width:750px;
  15.     margin:0 auto;
  16.     background-image: url(repeat-y-back.gif);
  17.     background-repeat:repeat-y;
  18.     margin-bottom:0px;
  19.     margin-top:0px
  20. }
  21.  
  22. body {
  23.     text-align: center;
  24.     margin-bottom:0px;
  25. }
  26.  
  27. #banner {
  28.     width: 700px;
  29.     height: 150px;
  30.     text-align:center;
  31.     background-image: url(JamesBanner.gif);
  32.     margin-top:0px
  33. }
  34.  
  35. h1 {
  36.     color:#ffffff;
  37.     display: block;
  38.     width: 700px;
  39.     padding-left:0px;
  40.     padding-right:0px;
  41.     padding-bottom:3px;
  42.     padding-top:3px;
  43.     margin-top:0px;
  44.     margin-bottom:5px;
  45.     border-top: solid 1px black;
  46.     border-bottom: solid 1px black;
  47.     background-color: #666666;
  48.     background-image: url(heading.gif);
  49.     font-size:16px;
  50.     text-align:center;
  51.     font-family: Verdana;
  52.     font-style:italic;
  53.     height:19px
  54. }
  55.  
  56. #content {
  57.     padding-left:10px;
  58.     padding-right: 10px;
  59.     width: 680px;
  60.     text-align:left;
  61.     margin-bottom:0px;
  62. }
  63.  
  64. #footer {
  65.     margin:0 auto;
  66.     margin-top:0px;
  67.     width:750px;
  68.     height:50px;
  69.     background-image: url(footer.gif);
  70. }
  71.  
  72. #links {
  73.  
  74.  
  75.     }
  76.  
Feb 13 '08 #1
9 23148
GloStix
54
HTML
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <title>James Mann - Portfolio</title>
  4. <link rel="stylesheet" href="styles.css" type="text/css">
  5.  
  6. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><style type="text/css">
  7. <!--
  8. body {
  9.     background-color: #9cad32;
  10. }
  11. -->
  12. </style></head>
  13.  
  14. <body>
  15. <div id="wrapper">
  16. <div id="container">
  17.  
  18. <div id="banner">
  19. <a href="#"></a>
  20. </div>
  21. <!--<div id="links">
  22. <a href="#">Home</a>
  23. </div>
  24. -->
  25.  
  26. <h1>Biography</h1>
  27. <div id="content">
  28. <p> xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  29. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  30. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  31. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
  32.  
  33.  <p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  34. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  35. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
  36.  
  37.  <p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  38. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  39. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
  40.  
  41.  <p> xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  42. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  43. xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
  44.  
  45. </div>
  46.  
  47.  
  48.  
  49. </div>
  50. <div id="footer">
  51.  
  52.  
  53. </div>
  54. </div>
  55.  
  56. </body>
  57. </html>
  58.  

Feb 14 '08 #3
GloStix
54
Get a quicker, more complete answer.
Okay I posted the rest (this forum needs an edit option >.>)
Feb 14 '08 #4
probably the padding on <h1>Biography</h1>. I've had this problem in Firefox before
Feb 14 '08 #5
GloStix
54
probably the padding on <h1>Biography</h1>. I've had this problem in Firefox before
I don't think so =\ It was like that before I messed around with the padding.
Feb 14 '08 #6
different browsers have different default paddings for certain elements. I like to start my css with * {margin: 0; padding: 0;} to avoid these cross-browser inconsistencies. Add this and see if it fixes the problem.

or try removing the margin-top: 3px from your h1 style
Feb 14 '08 #7
drhowarddrfine
7,435 Expert 4TB
It is not a "Firefox problem" and "cross browser problems" rarely are. Modern browsers treat <html> and <body> as stylable elements so it might be the margin assigned to the body (where IE screws up and is the real source of "cross browser problems"). So that is why the universal zeroing of margin you show works.

Better:
html,body{margin:0}

In addition, you don't show a doctype. Without a proper doctype, IE is in quirks mode and doesn't attempt to act like any modern browsers, such as Firefox.

Note: I'm going to bed and didn't test if this is the fix. If it isn't, say so and I'll look again in the morning.
Feb 14 '08 #8
GloStix
54
Expand|Select|Wrap|Line Numbers
  1. html,body {
  2.     margin:0;
  3.     padding:0;
  4. }
  5.  
Fixed!

Thank you good people :)
Feb 14 '08 #9
RE: crazeway
different browsers have different default paddings for certain elements. I like to start my css with * {margin: 0; padding: 0;} to avoid these cross-browser inconsistencies. Add this and see if it fixes the problem.

or try removing the margin-top: 3px from your h1 style

---


AHA! THANK YOU! I was trying everything and this was the only thing that worked.
Jan 5 '13 #10

Sign in to post your reply or Sign up for a free account.

Similar topics

4
by: hilz | last post by:
Hi all: Is there a way to make the <fo:page-number> start from a value different than 1 ? (using fop to generate pdf) thanks hilz
3
by: David Hayes | last post by:
I've made tooltips work in Firefox*, but tooltip doesn't appear at the specified location until the SECOND time that the user passes the mouse over the location with the mouseover event. What I...
2
by: Sara T. | last post by:
I always found that web page written by ASP.NET (VB.NET) generate error when starting at the first times. If I click refresh button on the IE again, it can work as well. What's wrong ? Again...
7
by: VK | last post by:
Is it possible to include SVG object right onto HTML page in Firefox 1.5? (I mean native SVG, not SVG plugin) .... <svg> .... </svg> All samples on mozilla.org are either stay-alone .svg...
4
by: lmarceglia | last post by:
Hi, I have this website that doesn't work in Firefox 1.5: www.pianetaluca.com The HTML source is: <TITLE>PianetaLuca</TITLE> </HEAD>
0
by: Paolo Pantaleo | last post by:
I am writting down a pege with useful links for a Python programmer. That is reference, tutorials and anything that can be useful. I use it regulary when programming in Python and I can't do...
12
by: CalgaryWebGuy | last post by:
Please help, My class assignment is due today and I am all finished except for one small portion. The instructor wants us to import a script from somewhere else, and for some reason I...
9
by: =?Utf-8?B?Sm9obiBCYWlsZXk=?= | last post by:
I have a ASP .Net page that allows moving around items on the page through javascript. This page works fine in IE. In FireFox however, I have found that if the page is using XHTML 1.0...
3
by: Cirene | last post by:
I usually program in .NET, but for this site I'm using normal HTML. Here's a temporary link: http://www.growtechinc.com/test/savage/projects.html In IE the page shows up fine. In Firefox the...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.