3 replies [Last post]
johnny0313x
Offline
newbie
Bethlehem, PA
Last seen: 11 years 31 weeks ago
Bethlehem, PA
Timezone: GMT-5
Joined: 2009-01-06
Posts: 10
Points: 11

Here is my site, only thing it is missing is news articles which I can't post just yet.
The Fan Network/Knetwork and gallery do not need to be checked.
The home button will work once I make the site live
I have checked my site in these browsers:
Mac: Chrome 3/4, Firefox 3.5.5, Safari 4.0.4, Sea Monkey 2.0.2
Problem with Firefox 3.5.5 is there is a blue box around the album image on the main page not on the lyrics page though, any ideas?

Windows: Internet explorer 8
IE 8 has a weird shift on the lyrics page where the content is, the video on media page extends into the side bar, and the blue box around the album image in the header on all pages except lyrics
All FireFox versions have that blue box around the albums image in the header and a small shift at the footer
Firefox 2.0 has a huge shift with the links by the header and the content
IE 7 moves the first header of the news up into the link images & blue box on album image in header
Navigator 9/8 the whole site is a mess
Safari 4/3.2.1 has a shift for the links images below the header

I don't know how to fix these problems so any an all advice on my coding would be appreciated. Plus if you find any other errors.

I did validate my code and most of that I did not understand except for the fact that I am missing alt codes which I will add in but they are my least worry right now.

The forum won't let me put my HTML in here even with the CODE tag it says it's spam...

CSS:

body {
 
background-color: #000;
background:#1E1B16 url(images/neonbg.gif);
 
text-align:center;
 
margin:0; 
 
 
}
 
 
 
 
#header{
width:800px;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 0px solid #f00;
height:445px;
background:#1E1B16 url(images/bg_top.gif) repeat-x top;
margin-left: auto;
margin-right: auto;
}
 
#kesha{
position: relative; 
float: left;
 
    width:324px;
 
    height:445px;
 
    margin: 0px;
 
    top: 0px;
 
    left: 0px;
 
    background-color: #FF0000;
background:url(images/kesha_top.png) no-repeat;
 
}
 
#innerwrap{
	width:447px;
	height:445px;
	margin:0px;
	top: 0px;
	position: relative; 
	float: right;
 
 
}
 
#menu{
	width:447px;
	height:287px;
	margin:0px;
	top: 8px;
	position: relative; 
	float: right;
	background:url(images/headlines.png) no-repeat;
 
 
}
 
#menu p {
  margin-top: 75px;
  margin-left:75px;
  font-size: 12px;
  line-height: 1.5em;
  text-align: left;
  font-family: sans-serif;
  font-style: normal;
  font-variant: normal;
	font-weight: normal;
	font-size: small;
	line-height: 150%;
	word-spacing: normal;
	letter-spacing: normal;
	text-decoration: none;
	text-transform: none;
	text-indent: 0ex;
	color: #222;
 
 
}
 
.class1	a:link {color: #E0FFFF; text-decoration: underline; }
.class1 a:active {color: #0000ff; text-decoration: underline; }
.class1 a:visited {color: #E0FFFF; text-decoration: underline; }
.class1 a:hover {color: #000; text-decoration: none; }
 
 
 
 
 
 
 
 
#album{
	margin:0px;
	width:447px;
	height:88px;
	bottom: -10px;
	right: -55px;
	position: relative; 
	float: left;
 
 
}
 
#headlines{
	margin:0px;
	width:447px;
	height:88px;
	bottom: 10px;
	right: -75px;
	position: relative; 
	float: left;
 
 
}
 
 
#logo{
	margin:0px;
	width:447px;
	height:88px;
	bottom: -19px;
	right: -95px;
	position: relative; 
	float: left;
	background:url(images/logo.png) no-repeat;
 
}
 
#links{
	margin:0px;
	width:800px;
	height:37px;
	bottom: 0px;
	right: 0px;
	position: relative; 
	float: right;
 
 
 
 
}
 
 
 
 
ul li {
	display: block;
	float: left;
	list-style: none;
}
 
ul li a {
	display: block;
	height: 37px; width: 86px;
	background: transparent url(images/links.png) no-repeat 0 0;
	text-indent:-9009px;
}
 
ul li#navigation2 a {
	width:110px;
	background-position: -86px 0;
}
 
ul li#navigation3 a {
	width:123px;
	background-position: -196px 0;
}
 
ul li#navigation4 a {
	width:97px;
	background-position: -319px 0;
}
 
ul li#navigation5 a {
	width:108px;
	background-position: -416px 0;
}
 
ul li#navigation6 a {
	width:100px;
	background-position: -524px 0;
}
 
ul li#navigation7 a {
	width:176px;
	background-position: -624px 0;
}
 
 
ul li a:hover {
	background-position: 0px -37px;
}
 
ul li#navigation2 a:hover {
	background-position: -86px -37px;
}
 
ul li#navigation3 a:hover {
	background-position: -196px -37px;
}
 
ul li#navigation4 a:hover {
	background-position: -319px -37px;
}
 
ul li#navigation5 a:hover {
	background-position: -416px -37px;
}
 
ul li#navigation6 a:hover {
	background-position: -524px -37px;
}
 
ul li#navigation7 a:hover {
	background-position: -624px -37px;
}
 
 
#content{
	background: url(images/fauxbg.gif) repeat-y;
	overflow: hidden;
width:800px;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 0px solid #f00;
height: auto;
background:#FFF;
margin-left: auto;
margin-right: auto;
padding: 0px 0px 0px 0px;
}
 
#content1{
width:493px;
background:#FFF;
font-family: Verdana;
font-size: 13px;
font-weight: normal;
text-decoration: none;
line-height: 17px;
color: #3e0f54;
padding-left: 12px;
float:left;
 
}
 
#content1 h1 {
	font-family: Verdana;
	font-size: 23px;
	line-height: 28px;
	padding-top: 27px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	color: #f40ce1;
}
 
#content1 h2 {
	font-family: Verdana;
	font-size: 12px;
	font-weight: normal;
	line-height: 5px;
	color: #0ccbf4;
}
 
 
#content1 a {
	font-family: Verdana;
	font-weight: normal;
	color: #0eebd8;
}
 
#content1 a:visited {
	font-weight: normal;
	color: #87d8bd;
}
 
#content1 a:hover {
	text-decoration: none;
	color: #3acbeb;
}
 
 
#sidebar{
width: 295px;
height: auto;
background:#fff;
font-family: Verdana;
font-size: 13px;
font-weight: normal;
text-decoration: none;
line-height: 17px;
color: #3e0f54;
float: right;
 
}
 
 
 
 
#content-lyrics{
width:780px;
border-top: 1px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 0px solid #f00;
height: auto;
background:#FFF;
margin-left: auto;
margin-right: auto;
padding: 10px 10px 10px 10px;
}
 
#footer{
clear:both;
width:780px;
border-top: 0px solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 0px solid #f00;
height: auto;
background:#66ccdd;
margin-left: auto;
margin-right: auto;
padding: 10px 10px 10px 10px;
}

johnny0313x
Offline
newbie
Bethlehem, PA
Last seen: 11 years 31 weeks ago
Bethlehem, PA
Timezone: GMT-5
Joined: 2009-01-06
Posts: 10
Points: 11

oh duh, I guess I link would

oh duh, I guess I link would help...
http://www.keshanow.net/index12.php

josephbm91
josephbm91's picture
Offline
Regular
Texas
Last seen: 11 years 26 weeks ago
Texas
Timezone: GMT-5
Joined: 2010-02-07
Posts: 17
Points: 17

Help

Hey there! I think your site looks pretty good!

Concerning the blue border on the home page vs the lyrics page, compare the code.

Home:

<div id="album"><a href="http://itunes.apple.com/us/album/animal/id344796445"><img src="images/album.png"></a></div>

Lyrics:
<div id="album"><a href="http://itunes.apple.com/us/album/animal/id344796445"><img src="images/album.png" border="0"></a></div>

It shows up on IE the same way just for future reference Smile

DUDE!
Your lyrics page has no DOCTYPE! I know you meant to because you have

<html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="en" lang="en">

but not the Doctype! The Validator is showing 138 errors accordingly. I'd highly suggest using PHP Includes for the Doctype so you don't forget. Your site is already using PHP so this won't take long to implement.

Your index12 page also has 80 or so errors according to the validation.

ALWAYS VALIDATE Laughing out loud

Go ahead and finish validating your site, and then come back when it's all cleaned up and we'll see if there are any problems left.

johnny0313x
Offline
newbie
Bethlehem, PA
Last seen: 11 years 31 weeks ago
Bethlehem, PA
Timezone: GMT-5
Joined: 2009-01-06
Posts: 10
Points: 11

Hey I validated all the html

Hey I validated all the html and I hate to say it but I actually really enjoyed doing it, I felt like I learned something and I feel...valid?

Anyways, all the pages had 22 errors left over except lyrics only had 7. Most of the errors are from scripts and I am not sure how to fix those errors, anyone have a clue? are they okay the way they are?

Also here are my browser problems now:

IE7 the first news header shifts up slightly into the main links
Safari 3.2.1 the main links shift to the right
Netscape 8.1.3 The main links shift to right (should I even care about netscape?)
Firefox 3.5.5 on Mac OSX snow leopard - About one pixel shift on footer(not a huge deal)

So I'd say that list is much improved since the validation, can anyone else help me with these issue and let me know which are fixable/most important? Like I'm assuming netscape is so far in the past and since no one really uses it I shouldn' t be as concerned with that? It be nice to have it work in all browsers though.