Error encountered: Unrecognized media in CSS validation and parsing issue

I've been having trouble validating my CSS and keep encountering error messages. Despite ensuring I have closing brackets, there are parse errors on line 39 and unrecognized media issues on lines 79 and 81. Additionally, lines 70 and 89 also trigger parsing errors. Any assistance with this matter would be greatly appreciated.

39.    nav a:{text-decoration:none;
    font-weight: bold;  }

nav a:link {color: #ffffff;}
nav a:visited {color: #808080;}
nav a:hover {color: #ff0000; } 

h1 {text-align: center; 
color: #ffffff; 
font-family: CustomHeaderFont}
h2 { text-align: center;
color: #ffffff; 
font-family: CustomHeaderFont}
h3 {text-align: center;
    color: #ffffff;
    font-family: CustomHeaderFont}
p { font-family: CustomFont;
color: #ffffff; 
text-align: center;}

ul li { padding: 5px 0px; }


footer { font-size: 90%;    
text-align: center;
clear: right;
padding: 15px;
color: #ffffff;
font-family: CustomFont;
}

70.   @media only screen and (max-width: 1024px){
body { margin: 0; }
#wrapper { width: auto; }
main {margin-left: 0;}
nav {float: none; width: auto; }
nav li { display: inline-block; padding: 0.5em; }
nav ul { text-align: center; }
nav a { border-style: none; }
h1, h2,h3 { font-size: 120%; }
79.    p { font-size: 90%; } }

81.    @media only screen and (max-width: 768px) {
h1, h2, h3{ font-size: 100%; }
p { font-size: 90%; }
main { margin: 0.5%;
   width: auto ;}
nav, nav ul, nav li { padding: 0;}
nav li { display: block; }
aside { display: none; }
89.    }

@font-face {
font-family: CustomFont;
src: url(Font/GlacialIndifference-Regular.otf); }

@font-face {
font-family: CustomHeaderFont;
src: url(Font/BLURRYFACE.ttf);
}

form { background-color: #000000;
        font-family: CustomFont;
        padding: 10px;
        }
fieldset{ width: 320px; 
          border: 2px ridge #ff0000;
          padding: 10px;
          margin-bottom: 10px;
          }
legend {  font-family: CustomHeaderFont;
            font-weight: bold;
        }
label { float: left;
        width: 100px;
        clear: left;
        text-align: right;
        padding-right: 10px;
        margin-top: 10px;
        font-family: CustomFont; 
    }
textarea, submit {margin-top: 10px;
                 display: block;
                 }
input checkbox {display: inline;
margin-bottom: 60px;}


table { border: 5px solid #ff0000;
        width: 600px;
        margin: auto;
        }
td, th {border: 1px solid #ff0000; 
        padding: 0.5em;
        font-family: CustomFont;}

caption { font-family: CustomHeaderFont;
          font-weight: bold;
          font-size: 1.2em;
          padding-bottom: 0.5em;
          } 

Answer №1

the 39th line contains a : following the character a

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using a CSS style to modify a class based on another class at the same level in the hierarchy

I am working with a jQuery carousel that is adding an 'active' class to images within a div. Within the same div, there is also a span with a 'fade' class that has a CSS style of opacity: 0. Is there a way to change the CSS style of the ...

col-md is taking precedence over col-sm at lower screen resolutions

Col-md takes precedence over col-sm in Bootstrap 4 https://i.sstatic.net/ydL5O.png ...

I am experiencing a situation where my content is overflowing but the scroll feature is

After making my website dynamic, I encountered an issue where the content overflow on the home page prevented me from scrolling to the bottom of the page. Here is a link to my website for reference: ...

"Enhance your website with the ability to dynamically load and display

I am facing a little issue and need suggestions because I am struggling with inserting data into an HTML page using the append jQuery function and AJAX request. Within my HTML block, under ul elements, there are some images that I directly insert into the ...

Assign a "margin-bottom" value of "0" to all elements in the final row of a responsive layout

I'm currently working on a Bootstrap responsive template design where I have multiple items arranged in rows. The number of items per row and the number of rows vary depending on the screen resolution. <div class="row"> <div class="col-xs- ...

JavaScript is incapable of locating image files

I am encountering Resource Not Found errors for the image files I am attempting to load into var manifest. Despite following the tutorial code closely, I can't seem to identify what is causing this issue... (function () { "use strict"; WinJS.Bin ...

Creating fixed values in HTML

I need to maintain consistency in the headings of multiple tables spread across 3 HTML pages. The heading structure is as follows: <thead> <tr> <th>MyHeading</th> </tr> </thead> My goal is to store the string MyHeadin ...

Setting the default value in the Angular input select

books.component.ts export class BooksComponent implements OnInit { public sortOrder; ... books.component.html <div class="form-group"> <label for="selectOrder">Sort</label> <select class="form ...

Triggering the body onunload event

I am currently developing a HTA that needs to make final modifications on the onunload event. However, I am facing an issue as the event does not appear to be triggered. Can someone confirm if this event is still supported? Is there an equivalent event in ...

what is the best way to align text with an image using CSS

Is there a way to display a form within an image without making it messy with additional tags and text? Below is the code that I currently have: .box { width: 650px; padding-right: 15px; /* creates gap on the right edge of the image (not con ...

Get a polished look using HTML and CSS exclusively

Allow me to illustrate what I am intending to accomplish with an example. div{ width:100px;height:100px; border:3px solid #900; border-radius:0px 0px 140px 0px; } <div></div> I am seeking a method to ...

Arrange a pair of div containers side by side on the webpage without the need to alter the existing

Is there a way to align these two div side by side? <div class="main_one"> <div class="number_one">Title A</div> </div> <div class="main_two"> <div class="number_two">Title B</div> </div> <div class=" ...

Having difficulty incorporating external SASS styles into my React.js project

In most of my projects, I follow a similar process for importing SASS styles. First, I create my react app and then install SASS using the command npm install node-sass. Next, I import my SASS file into my app components as shown below: import React from & ...

The issue with loading scripts in a ReactJS NextJS app is related to the inline condition not working

I'm having trouble with an inline condition for loading scripts. The condition seems to be working because the tag is displaying text, but when it comes to scripts, it doesn't work. How can I resolve this issue? const cookie = new Cookies().get ...

Deciding the source URLs for external iframes

Is it possible to detect the URL displayed in an iframe? How can we ensure that links within an iframe open in a new tab/window? Moreover, is there a way to achieve this even with the same-origin policy for external frames? If not, what causes this violat ...

Aligning an element vertically with the surrounding text on the same line

Trying to incorporate inline input range elements in a way that aligns with the line while also aligning with the right edge of the outer div has proven to be challenging. The HTML on the site is formatted using prettify, resulting in <span> elements ...

What is the best way to ensure that my text is perfectly centered both horizontally and vertically within this DIV?

What's the best way to vertically and horizontally center text? Here is an example code that needs to be centered: <div style="display: block; height: 25px;"> <span id="ctl_txt" style="background-color: rgb(255, 0, 0);"> Basic ...

Obtaining a variable from HTML and passing it to Node.js

Currently, I am utilizing express to handle form submissions. Within my HTML file, there are 20 inputs with unique ids such as address1, address2, address3, and so on. In my node js code, I access these input values using req.body.address1. Users have th ...

Adjust the path of an element as it decreases in size

Sorry for the weird title, but that's likely why I can't find the solution on my own. I'm experimenting with CSS animations and I want the form element to decrease in height from 100px -> 0, but I want it to collapse from the top to the ...

Unable to modify the hover color on the image or icon

After creating a circle icon with an image in the center, I wanted to make the image change colors on hover. The main focus of the icon is the circle itself. In my attempt to achieve this effect, I included the following code for the circle icon: .circle- ...