• Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.
    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

HTML & CSS Help with site validation errors

liilforceghost

New Coder
Hello,

I've been working on coding a site for some time now. At the moment, I've had issues with certain things and I'm sure it has to do with validation errors. I wasn't sure if anyone here would be able to help with them, as validation errors are a bit above what I'm currently able to do. I checked for open/closed tags which the site is free of.

Site link: https://acrossthestars.jcink.net
What Iused to locate errors: https://validator.w3.org/


Thanks.
 

Tealk

Well-Known Coder
What do you want to know?
Why don't you outsource css to a separate file, this makes the whole thing clearer.

CSS inside a file is not state of the art.

color: fff; # is missing
height: 100 px; there must be no space between the number and the size

And there are still a lot of such problems, too many to list here.
 

liilforceghost

New Coder
I guess when it comes to those errors, I'm just a bit out of my league as far as what to do with them. Or instance, parce errors as one example. (there are the other errors of course.) I'm not sure how to spot/fit that after even doing some googling, etc. I messed around with it for the past 3 days and fixed what I knew I could and the rest left is kinda a mess for me and more than I know how to do.

I'll post a link below with the CSS. I'll be sure to go in and fix the hashtag for the next color(s) and the px error today. Anyways, if this doesn't work let me know and I can try to do it a different way. https://codepen.io/lilforceghost/pen/gOLLWBm
 

liilforceghost

New Coder
Hey @liilforceghost,

How's it going with this? Are you still having validation issues?
I haven't really gotten anywhere with it as I had to handle a bunch of other coding stuff that was a tad more urgent than those errors. So kinda what's left, is what I'm dealing with and not sure how to fix (other than the ones mentioned previously.)

@Tealk - I did what I could, and could understand via my code knowledge, which is why I'm reaching out regarding this. :)
 

Antero360

Coder
Hello,

I've been working on coding a site for some time now. At the moment, I've had issues with certain things and I'm sure it has to do with validation errors. I wasn't sure if anyone here would be able to help with them, as validation errors are a bit above what I'm currently able to do. I checked for open/closed tags which the site is free of.

Site link: https://acrossthestars.jcink.net
What Iused to locate errors: https://validator.w3.org/


Thanks.
Hi there,

So I just ran your site against validator.w3... and oh boy lol.
From this result link ( https://validator.w3.org/nu/?doc=https://acrossthestars.jcink.net/ )

1613966493097.png
Any and all .html documents need to start with <!DOCTYPE html>, consider this a coding standard, as per w3schools ( https://www.w3schools.com/tags/tag_doctype.asp )

1613966645946.png
This means that when the document is opened, it is being picked up as having utf-8 encoding, which contradicts your iso-8859-1 encoding declaration.. simply use utf-8.

1613966765622.png
This one is pretty similar to the previous error. same solution.

1613966807510.png
Here, the css parser doesn't know what you are trying to do.. if you need background-size, you need a space between the dimensions, as well as what they represent:
background-size: 1000px 341px;

1613966990187.png
apparently it don't like double enter lol..

1613967027396.png
Here, you need a # in front of the hex values:
color: #fff;
( https://www.w3schools.com/colors/colors_hexadecimal.asp )

1613967108941.png
remove the space between 100 px
height: 100px;

1613967160098.png
same as above...
 

Antero360

Coder
1613967195503.png
there is no such value as "none".. padding needs integers
( https://www.w3schools.com/css/css_padding.asp )

1613967344089.png
Here, it's complaining that you have the @ symbol after a css rule... the only place @ should be used in css is if you are importing styles from another stylesheet... simply remove the @, and you should be fine

1613967447193.png
For these.. it might just be an OS (operating system) end line character encoding issue.. simply delete the space and hit enter again...

1613967534907.png
Here, you need a duration time.. the attribute "infinite" simply means that it will indefinitely redo the animation after duration time...
( https://www.w3schools.com/cssref/css3_pr_animation.asp )

1613967751233.png
Did you mean:
#scrollbar-width
{
width: 100px;
}

1613967836213.png
You need units :)
left: 775px;

1613967875569.png
I do believe you meant:
#myDiv
{
text-decoration: none;
}
 

Antero360

Coder
1613968002914.png
In this case, since you are using inline-css.. you need to have the style attribute:

<div id="navstrip" style="float: left;">

1613968130596.png
hey, this is something I would be doing to try and break your site XD.. lol so my question is the following.. are you coding up your site in pure html/css/js... or are you also using another language, like python, c#, etc?

1613968233817.png
You have several of these... as per w3 standards, all images need to have alternative text in case the image does not load.
<img src="mylinktoimg.png" alt="I need Alt for this, STAT!" />

1613968343834.png
Here, if you are using either of the list structures (ul (unordered), ol (ordered)), you need to have <li> as a child.
<ul>
<li>
<span>This is my hierarchy!</span>
</li>
</ul>

1613968567376.png
Do you have an opening tag for this?
 
Top