• Locked
5 replies [Last post]
Fri, 2011-03-25 09:55
netto
netto's picture
Offline
newbie
Last seen: 11 years 7 weeks ago
Timezone: GMT+2
Joined: 2011-03-25
Posts: 4
Points: 5

I am doing my excise for html/css course.We are suppose to make a portfolio with at least 4 xhtml files.
After i have done the first one ,i copied the code to make other files ,but i find that one page has different layout from the others,there is a space between the browsers top side and the header,while it should be no space.Here is the link to the two pages:
The first file :
The second file:

i have checked the code ,can't find anything different.Really cant figure it out.Hope someone can help.

Here is the css code:

@charset "UTF-8";
 
body{
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;
		color:#686868;
		background:#FFFFFF ;
		margin:0 ;
 
	}
h2{text-align:center;font-family:Arial;color:#993466;
 }
 
#wrapper {width:960px;
           background:#FFF;
           margin:0px auto;
           }
 
 
#header {background:#993366;
         color:#FFF;
         text-align:center;
         padding:20px;
         }
 
#nav{ background:#D889B8;
      margin-top:0px;
      height:30px;
      padding-top:5px
      ;padding-bottom:5px;
}
 
#nav ul {  margin:0;
           padding;0;
}
 
#nav ul li {   list-style-type:none; 
               display:inline;
               font-weight:bold;
               font-size:14px;
 
}
 
#nav li a {
  display:block;
  padding:5px 20px;
    color:#000; 
   float:left ;
   text-decoration:none;
}
 
#nav a:hover { background:#FFF; }
 
a:link    { color: #43b3e9; text-decoration:underline;}
a:visited {color: #43b3e9; text-decoration:none;}
a:hover   { color: #43b3e9; text-decoration:none;}
 
#content {
 
        background:#F7F3E8;	
        color:#000; 
        padding:10px;
 
	}
 
#footer { background:#993366;
          color:#000;
         padding:3px ;
         margin-bottom:15px;
         text-align:center
}

Top
Tags:
Fri, 2011-03-25 10:01
#1
netto
netto's picture
Offline
newbie
Last seen: 11 years 7 weeks ago
Timezone: GMT+2
Joined: 2011-03-25
Posts: 4
Points: 5

i cant edit my post, here are

i cant edit my post, here are the links to the two pages

The first one

The seconde one

Top
Fri, 2011-03-25 10:11
#2
Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 18 weeks 5 days ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2050
Points: 2282

I see no difference between

I see no difference between the two layouts.

Top
Fri, 2011-03-25 10:21
#3
netto
netto's picture
Offline
newbie
Last seen: 11 years 7 weeks ago
Timezone: GMT+2
Joined: 2011-03-25
Posts: 4
Points: 5

I just checked again,still

I just checked again,still can see the differece: the header positions are different.Have no idea about how this comes up. By the way ,my browser is Fiefox3.6. Sad

Top
Fri, 2011-03-25 10:38
#4
Verschwindende
Verschwindende's picture
Offline
Guru
Last seen: 18 weeks 5 days ago
Timezone: GMT-5
Joined: 2009-10-09
Posts: 2050
Points: 2282

I do see it in Firefox. It

I do see it in Firefox. It is good to mention which browser causes the issue.

The issue remains without styling as well.

There is a byte order mark or other invisible character at the beginning of the second file. Save it as ANSI and see it.

Top
Fri, 2011-03-25 11:45
#5
netto
netto's picture
Offline
newbie
Last seen: 11 years 7 weeks ago
Timezone: GMT+2
Joined: 2011-03-25
Posts: 4
Points: 5

Verschwindende Thanks so

Verschwindende

Thank you so much! i find the problem now ,there is 2 ?? byte order mark before the doc type.When i saved in ANSI, it showed clearly in browser.I put the source code to the html validator,it also found the problem.If i have validated my code ,it would be much easier to find out the problem.Thanks a lot .New lesson learned in coding!

Top
  • Locked