PDA

Click to See Complete Forum and Search --> : web developing

insei
01-25-2010, 04:54 PM
ok , i really need some advice here...

i try to validate my pages with:
http://validator.w3.org/
until i reach a certain point where everything i do shows up as an error, and errors i dont understand, errors which should be right, and not an error. This is so annoying and so frustrating that i stopped validating, i thought that as long as i see on the browser that everything is in place, who cares about the validation error right..? yeah sure, very smart..

Now im about to give this whole thing up, when there is an error, its like looking for a needle in the haystack, it is soooooooooo annoying and frustrating that i cant even explain, i just feel like giving up the whole thing.. it saddens me.

Its like this: I allways tell myself that i will validate 100% when i start over, but then i start getting like 500 errors when i do a select input with 400 countries, i mean i dont understand whats wrong ;/ the syntax is supposed to be right..

and right now, my wrapper wont wrap what its supposed to wrap.
i have so many cool ideas and i want to start making them, but i still
cant get past the simple layout problems... i still dont understand why sometimes a div wrapper wont wrap its children divs (which are float:left) unless its float left itself? makes no sense.
Charles
01-25-2010, 05:31 PM
Well, no. If the validator says it's wrong then the syntax is wrong, by definition. But yes, there are things that can cascade down the page. The place to start is by making certain that you are using HTML and not XHTML or a mixture of the two. Then run the thing through HTML TIdy (http://tidy.sourceforge.net/) If that doesn't fix the thing then post a URL and we'll give it a look.
insei
01-25-2010, 06:00 PM
i dont really know to be honest :S

This is how it looks : http://www.xgs-gaming.com/ladder_system_1.1/whywhy.php

This is what i add on my html's :
<!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>TLT System</title>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>

<div class="big_box_wrapper">
<div class="box"><p>whywhywhy!</p></div>
<div class="big_box_main_container_padding">
<div class="profile_menu_wrapper">
<div class="profile_links"><a href="m_profile.php?navigate=personal"><img src="images/profile/act_personal.jpg" alt=""></a></div>
<div class="profile_links"><a href="m_profile.php?navigate=gaming"><img src="images/profile/nct_gaming.jpg" alt=""></a></div>
<div class="profile_links"><a href="m_profile.php?navigate=wall"><img src="images/profile/nct_wall.jpg" alt=""></a></div>
<div class="profile_links"><a href="m_profile.php?navigate=photos"><img src="images/profile/nct_photos.jpg" alt=""></a></div>
<div class="profile_links"><a href="m_profile.php?navigate=options"><img src="images/profile/nct_options.jpg" alt=""></a></div>
<div class="profile_links"><a href="m_profile.php?navigate=report"><img src="images/profile/nct_report.jpg" alt=""></a></div>
<div class="profile_links_right"></div>
</div>
<div class="profile_main_wrapper">
<div class="profile_col300_divider">
1! <br />
2! <br />
3! <br />
4! <br />
5! <br />

</div>
<div class="profile_col574_divider">
1! <br />
2! <br />
3! <br />
4! <br />
</div>
</div>


</div>
<div class="big_box_bottom">
</div>
</div>

</body>
</html>

even this here wont wrap..
http://www.xgs-gaming.com/ladder_system_1.1/whywhy2.php
this is without the inner divs that i included above..

<!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>TLT System</title>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>

<div class="big_box_wrapper">
<div class="box"><p>whywhywhy!</p></div>
<div class="big_box_main_container_padding">
<div class="profile_main_wrapper">
1! <br />
2! <br />
3! <br />
4! <br />
5! <br />
6! <br />
7! <br />
8! <br />
9! <br />
</div>
</div>
<div class="big_box_bottom">
</div>
</div>

</body>
</html>


css relevant for the code above:

/* /////////////// BOXES BIG ///////////////// */

.big_box_noheader {
display: block;
width: 916px;
height: 14px;
background:url('../images/big_box_noheader.jpg') top no-repeat;
}
.big_box_wrapper .box {
display: block;
width: 916px;
height: 42px;
background:url('../images/big_box_top.jpg') top no-repeat;
}
.big_box_wrapper .box p {
text-align: center;
padding: 14px 0px 0px 0px;
text-decoration: none;
font: bold 13px/25px arial, helvetica, sans-serif;
color: white;
}
.big_box_wrapper {
width: 916px;
background-image:url('../images/big_box_middle.jpg');
}
.big_box_main_container {
width: 884px;
margin: 0px 0px 0px 14px;
background-color: #eff7fb;

}
.big_box_main_container_padding {
width: 874px;
padding: 5px;
margin: 0px 0px 0px 14px;
background-color: #eff7fb;

}
.big_box_bottom {
display: block;
width: 916px;
height: 16px;
background:url('../images/big_box_bottom.jpg') bottom no-repeat;
}

/* //////////////////////// PROFILE DIVS ///////////// */

.profile_menu_wrapper {
background-color:red;
width: 874px;
height: 25px;
}
.profile_links {
float:left;
display: block;
background-color:yellow;
width: 121px;
height: 25px;
}
.profile_links_right {
display: block;
background-image:url("../images/profile/right.jpg");
float:left;
width: 148px;
height: 25px;
}
.profile_main_wrapper {
float:left;
background-image: url("../images/profile/profile_bg.jpg");
background-repeat: repeat-y;
background-color: #eff7fa;
width: 874px;
}
.profile_col300_divider {
float:left;
width: 300px;
background-color: red;
}
.profile_col574_divider {
float: left;
width: 574px;
background-color: yellow;
}
Charles
01-26-2010, 04:41 AM
A lot of you problem has to do with you using XHTML. Step one is to switch to HTML and you should be using HTML 4.01 Strict.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Fang
01-26-2010, 04:56 AM
.big_box_main_container_padding {overflow:hidden;}
http://www.quirksmode.org/blog/archives/2005/03/clearing_floats.html
Also validate the css (http://jigsaw.w3.org/css-validator/validator?profile=css21&warning=0&uri=http%3A%2F%2Fwww.xgs-gaming.com%2Fladder_system_1.1%2Fwhywhy.php)
insei
01-26-2010, 07:40 AM
Thanks alot Fang, i read the article about floating elements. And thanks for the css validating tips.

Charles: Thanks for the tips. But when should someone use xhtml instead of HTML 4.01?
Charles
01-26-2010, 08:01 AM
1) You should never use the transitional versions. They were offered to get us over the hump until browsers started supporting CSS. That happened a very long time ago.

2) Use XHTML when 2.1) You really know what you are doing, 2.2) Want the page to be more easily parsed by robots, 2.3) you need to make use of XHTML's special features like XSLT stylesheets and external entities or 2.4) you need to mix XHTML with some other mark up language like MathML or Atom.
insei
01-26-2010, 11:42 AM
Thanks alot, that cleared up a whole lot of things.