Linked in stylesheet ошибка

If a property starts with -webkit- it means you’re using some experimental code that will normally only work in WebKit-based browsers (Safari, Chrome) and cause errors or warnings everywhere else.

In noticing this error and asking the question you’ve done the right thing though — now you can learn a few simple things about how CSS is developed and how to use experimental and upcoming features safely.

First: why is this code «experimental»? It’s because the experienced web developers and computer specialists who sit down together to plan new features for CSS are still trying to figure out how it should work exactly. Over time they try different keywords and syntaxes (discussing details like ‘should it say «ease-in-out» or «in-out»?’). While doing so they also want some testing in the real world and feedback from real developers, so they encourage web browsers like Chrome and Opera to support stuff that’s unfinished — but with a prefix. The prefix -webkit- then means «this is a temporary implementation, we’re not sure that any other browser will ever understand the «ease-in-out» instruction because we haven’t finished deciding this, but you can test it as long as you understand it’s temporary and you may have to go back and fix your code later, if we change our mind».

To do this correctly, you need to do a bit of research on whether this CSS feature is still experimental. You’re trying to use CSS transitions, so you might for example take a look at this:

http://caniuse.com/#feat=css-transitions

Here you see a table of browsers and versions. You see which versions require a prefix like -webkit- , -ms- , -moz- or -o- (for Safari/Chrome, Internet Explorer, Firefox and Opera respectively).

In this case, the most recent versions of Internet Explorer, Firefox and Opera support this CSS instruction without a prefix, which basically means «we think we’re done discussing this now, pretty sure it’s going to be like this forever. If you write just ‘transition’ now you won’t have to come back and fix your code because we changed our mind.»

On the other hand, WebKit-based browsers still require a -webkit- prefix. So what you should do is to make sure you add this instruction twice — once with a -webkit- prefix, followed by one line without the prefix. Like this:

-webkit-transition: opacity 0.5s ease-in-out 0s;
transition: opacity 0.5s ease-in-out 0s;

If you feel very thorough and want to support older Firefox and Opera versions you could also add the -moz- and -o- lines.

If you make sure the code looks like that, you can now ignore the warnings. You’ve dealt with the problem it was warning you against.

Answer by Alberto Curtis

I am trying to add a Youtube video in my page using a CSS style sheet to my page, for some reason, video is not appearing,

Stack Overflow for Teams
Where developers & technologists share private knowledge with coworkers

,Thanks for contributing an answer to Stack Overflow!,Making statements based on opinion; back them up with references or personal experience.

.youtube-video iframe,
.youtube-video img,
.youtube-video-2 iframe,
.youtube-video-2 img {
    position: absolute;
    top: 0px;
    left: 12%;
    width: 890px;
    height: 500px;
    cursor: pointer;
}
img {
    vertical-align: middle;
}
.youtube-video iframe,
.youtube-video img,
.youtube-video-2 iframe,
.youtube-video-2 img {
    position: absolute;
    top: 0px;
    left: 12%;
    width: 890px;
    height: 500px;
    cursor: pointer;
}
img {
    vertical-align: middle;
}
<iframe width="420" height="315" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe>

Answer by Vera Liu

Otherwise, the default style sheet language is «text/css».,Setting the default style sheet
language,Otherwise, if any HTTP headers specify the «Content-Style-Type», the last
one in the character stream determines the default style sheet language.,The syntax of style data depends on
the style sheet language.

For example, the following short CSS style sheet (stored in the file
«special.css»), sets the text color of a paragraph to green and surrounds it
with a solid red border:

P.special {
color : green;
border: solid red;
}

Authors may link this style sheet to their source HTML document with the
LINK
element:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
  <HEAD>
    <LINK href="special.css" rel="stylesheet" type="text/css">
  </HEAD>
  <BODY>
    <P class="special">This paragraph should have special green text.
  </BODY>
</HTML>

Answer by Santiago Krueger

You need to make sure that there aren’t any errors in either your HTML or your CSS, since mistakes in either place can result in botched document appearance. As you’re learning CSS, that can be difficult. To that end, you should visit the following sites to check your handiwork:
,
Another very common author error is the tendency to put HTML in places it shouldn’t be— especially external stylesheets. If you are LINKing or @importing a stylesheet, then there should be no HTML whatsoever in that stylesheet. That includes HTML comments, the <STYLE> tag, or anything else.
,
For some reason, a very common error on the part of authors is the tendency to put spaces between values and their units. For example:
,
In addition, make sure you use it correctly, and don’t go overboard with the attributes. You should really have only one LINK element, which should look very much like this:

For some reason, a very common error on the part of authors is the tendency to put spaces between values and their units. For example:

   P {margin-left: 50 px;}

Notice the space between 20 and px? That’s wrong. Values and units are never separated by a space. Having the space there will make the value invalid, which means that the entire rule is invalid, which means that your paragraphs won’t have a fifty-pixel left margin. Instead, you need to write:

   P {margin-left: 50px;}

So assume that you have the following file, called mystyles.css, which you’re importing into HTML documents.

   /* mystyles.css */
   H1, H2, H3 {font-family: sans-serif;}
   P {margin-left: 50px;}
   CODE {color: #333;}
   <!-- add new styles below this line -->
   H2 {clear: both;}
   IMG {float: right;}

See that HTML comment about adding new styles? It’s wrong. Rip it out, delete it, or turn it into a CSS comment, like the first line of the file. Thus, the «new styles below» comment should look like this:

   /* add new styles below this line */

The other big error is to start out external stylesheets like this:

   <STYLE type="text/css">

In addition, make sure you use it correctly, and don’t go overboard with the attributes. You should really have only one LINK element, which should look very much like this:

   <LINK rel="stylesheet" type="text/css"
     href="mystyles.css" title="Default Styles" media="screen">

Fortunately, it’s easy to work around this. All you need to do is declare a zero-width border for the element, and magically, the background will be correctly filled with color.

   P.side {background: aqua; border: 0px solid aqua;}

In the meantime, however, here’s the script:

   <SCRIPT LANGUAGE="JavaScript1.2">
   <!--
      NS4 = document.layers;
      if (NS4) {
         origWidth = innerWidth;
         origHeight = innerHeight;
      }   
   function reDo() {
      if (innerWidth != origWidth || innerHeight != origHeight) 
         location.reload();
   }   
   if (NS4) onresize = reDo;
   //-->
   </SCRIPT>

Answer by Sutton Santos

Browsers will often cache, or temporarily store, resources from websites you visit in order to improve load speed. Some sites will also use plugins for additional caching. Often when you don’t see your custom styles on your site, it’s because the browser or other system has cached an older version of your site.,If clearing your browser cache doesn’t seem to work, here are a couple of additional strategies to try:,If you find that you’d like to write more custom CSS for your forms or any other part of your site, consider checking out CSS Hero, a plugin which allows you to style your forms or site easily without code.,In this situation, the browser prefers the specificity of the default CSS over the !important, and so this CSS will not be applied on your site.

If you are only using a small amount of CSS, however, it may sometimes be easier to do a quick format check of your own. Let’s start by looking at a snippet of valid CSS:

div.wpforms-container-full .wpforms-form .wpforms-title {
    font-size: 26px;
    margin: 0 0 10px 0;
}

For example, here’s the default CSS that sets the font size of form titles in WPForms:

div.wpforms-container-full .wpforms-form .wpforms-title {
    font-size: 26px;
}

Let’s try to override that CSS to make the font bigger. It may be tempting to use a short CSS selector, like this:

.wpforms-title {
    font-size: 40px;
}

That CSS is valid, but its styles won’t come through in the browser. The default styles will be applied instead because they have a more specific selector. You would instead need to use the same, longer selector as the default style for your custom CSS:

div.wpforms-container-full .wpforms-form .wpforms-title {
    font-size: 40px;
}

It’s important to note, however, that adding !important will not always work. Let’s try this approach for the CSS we discussed in the last example:

.wpforms-title {
    font-size: 40px !important;
}

Here is the CSS that creates that style (#ff0000 is a hex code for red):

div.wpforms-container-full .wpforms-form .wpforms-required-label {
    color: #ff0000;
}

We want to make these asterisks appear blue instead. We could copy that full selector from the CSS above, or we could use a short selector and add an !important, as in this CSS snippet:

.wpforms-required-label {
    color: #007acc !important;
}

Answer by Zayd Hayes

CSS defines style declarations and applies them to HTML documents. There are three different ways to link CSS to HTML based on three different types of CSS styles:,Other benefits from linking a CSS file to an HTML document are:,Inline – uses the style attribute inside an HTML element,External – links an HTML document to an external CSS file

Start linking style sheets to HTML files by creating an external CSS document using an HTML text editor and adding CSS rules. For instance, here are the style rules of example.css:

body {
  background-color: yellow;
}

h1 {
  color: blue;
  margin-right: 30px;
}

Then, use the <link> tag in the <head> section of your HTML page to link a CSS file to an HTML document. Next, specify the name of your external CSS file. In this case, it’s example.css so the code will look as follows:

<head>
<link rel="stylesheet" type="text/css" href="example.css" media=”screen” />
</head>

Answer by Vienna Flores

The <LINK> tag is placed in the document HEAD. The optional TYPE attribute is used to specify a media type—text/css for a Cascading Style Sheet—allowing browsers to ignore style sheet types that they do not support. Configuring the server to send text/css as the Content-type for CSS files is also a good idea.,The CLASS attribute is used to specify the style class to which the element belongs. For example, the style sheet may have created the punk and warning classes:,The STYLE element is placed in the document HEAD. The required TYPE attribute is used to specify a media type, as is its function with the LINK element. Similarly, the TITLE and MEDIA attributes may also be specified with STYLE.,The ID attribute is used to define a unique style for an element. A CSS rule such as

A style sheet may be embedded in a document with the STYLE element:

<STYLE TYPE="text/css" MEDIA=screen>
<!--
  BODY  { background: url(foo.gif) red; color: black }
  P EM  { background: yellow; color: black }
  .note { margin-left: 5em; margin-right: 5em }
-->
</STYLE>

A style sheet may be imported with CSS’s @import statement. This statement may be used in a CSS file or inside the STYLE element:

<STYLE TYPE="text/css" MEDIA="screen, projection">
<!--
  @import url(https://htmlhelp.com/style.css);
  @import url(/stylesheets/punk.css);
  DT { background: yellow; color: black }
-->
</STYLE>

The CLASS attribute is used to specify the style class to which the element belongs. For example, the style sheet may have created the punk and warning classes:

.punk     { color: lime; background: #ff80c0 }
P.warning { font-weight: bolder; color: red; background: white }

Some examples of SPAN follow:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML>
<HEAD>
<TITLE>Example of SPAN</TITLE>
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css">
<STYLE TYPE="text/css" MEDIA="screen, print, projection">
<!--
  .firstwords { font-variant: small-caps }
-->
</STYLE>
</HEAD>
<BODY>
<P><SPAN CLASS=firstwords>The first few words</SPAN> of a
paragraph could be in small-caps. Style may also be inlined, such as
to change the style of a word like <SPAN STYLE="font-family: Arial">
Arial</SPAN>.</P>

Answer by Angie Collins

External style sheets — Using the <link> element, pointing to an external CSS file.,In this tutorial you’ll learn how easy it is to add style and formatting information to the web pages using CSS. But, before we begin, make sure that you have some working knowledge of HTML.,You can attach external style sheets in two ways — linking and importing.,An external style sheet is ideal when the style is applied to many pages of the website.

<h1 style="color:red; font-size:30px;">This is a heading</h1>
<p style="color:green; font-size:22px;">This is a paragraph.</p>
<div style="color:blue; font-size:14px;">This is some text content.</div>

Reasons why css is not linking to htmlCSS not linking to HTML is a common error that you will encounter when building web pages. It can lead to hours of frustration and debugging before you identify the root of the error. In this article, we will explore 13 situations that will prevent your CSS from linking to your HTML, along with their solutions. Read on, and you’ll level up your CSS debugging skills.

Contents

  • How Do I Link CSS to HTML?
  • Why Is My CSS Not Linking to My HTML?
  • Detailed Reasons Why Your CSS Is Not Linking to Your HTML
    • – You Are Not Using the Right Linking Tag
    • – Missing “Rel” Attribute
    • – You Spelled “Stylesheet” as “Stylesheets”
    • – Wrong Attribute Name in the Link Tag
    • – Wrong Value for the Type Attribute
    • – Path Error
    • – Wrong Folder Name
    • – Wrong File Name
    • – CSS Syntax Errors
    • – Wrong CSS Selector
    • – Trailing Characters in Your CSS Selectors
    • – Comment Fragments in Your CSS File
    • – You Forgot To Save Your Files
  • Conclusion

How Do I Link CSS to HTML?

You can link CSS to HTML by using the <link> tag or a pair of <style></style> tags in the <head> section of your HTML document.

Why Is My CSS Not Linking to My HTML?

Your CSS will fail to link to your HTML when there is a break in the relationship between the HTML and CSS. This relationship ensures both the HTML and CSS follow rules that will allow the CSS to link to the HTML.

Detailed Reasons Why Your CSS Is Not Linking to Your HTML

A lot can happen that can prevent your CSS from linking to your HTML file. In this section, we present you with thirteen reasons and their solutions.

The reasons are:

  • You are not using the right linking tag
  • Missing “rel” attribute
  • You spelled “stylesheet” as “stylesheets”
  • Wrong attribute name in the link tag
  • Wrong value for the type attribute
  • Path error
  • Wrong folder name
  • Wrong file name
  • CSS syntax errors
  • Wrong CSS selector
  • Trailing characters in your CSS selectors
  • Comment fragments in your CSS file
  • You forgot to save your files

Read on as we analyze each reason so you can prevent a repetition of this error in the future.

– You Are Not Using the Right Linking Tag

The concept of “linking tag” in this context is the HTML tag that you use to link CSS and HTML. There are two tags that you can use for connecting CSS to HTML. These tags are:

  • The link tag
  • The style tag

The Link Tag

This is the recommended tag for linking CSS to HTML. The preferred location for this tag on your web page is the <head> section of your web page. It loads a CSS file that is external to the current HTML element.

So, when your CSS fails to link to HTML, you should confirm that the link tag is present in the <head> section.

The  Style Tag

The style tag is an alternative method you can use to link a CSS to HTML. Its default location is the <head> section of your document. Its main usage is to allow you to write CSS styles in your HTML document.

Unlike the <link> tag that is a self-closing tag, <style> has a closing tag which is </style>. So, if you forget to use the closing tag, there is a chance that the CSS within the tag will not work with the HTML.

So, moral of the story is to always close the <style> tag.

– Missing “Rel” Attribute

The rel attribute is an attribute of the <link> tag. It defines the relationship that exists between an HTML file and a CSS file. Once you define the <link> tag, it should have the rel attribute. This informs the browser that the linked CSS file is a stylesheet meant for the HTML page.

If the rel attribute is missing, your CSS will fail to work, as you will be able to see if you run this code:

<head>
<!– This will not work –>
<link href=”myCSSFile.css”></link>
</head>
The fix is to ensure the rel tag is present in the link tag:
<head>
<!– This will work –>
<link rel=”stylesheet” href=”myCSSFile.css”></link>
</head>

– You Spelled “Stylesheet” as “Stylesheets”

The fix for this error is to write “stylesheet” with no “s” at the end.

In case you didn’t notice it, read this section’s title again, this time pay attention to the names. Did you spot the error?

There is an extra “s” in the second stylesheet. When you make this mistake, it will result in HTML not linking to CSS, as happened when running the coding example below:

<head>
<!– This will not work –>
<link rel=”stylesheets” href=”myCSSFile.css”>
</head>
Clearly, the fix is to write “stylesheet” with no “s” at the end.
<head>
<link rel=”stylesheet” href=”myCSSFile.css”>
</head>

– Wrong Attribute Name in the Link Tag

HTML <link> tag has three common attributes. They are:

  • rel
  • href
  • type

A typographical error in any of these names will not allow your CSS to link with the HTML. Keep an eye out for this one, as it can be a tough error to spot.

– Wrong Value for the Type Attribute

The type attribute is an optional attribute of the HTML link tag. Its value tells the web browser the nature of the linked document; in this case, a CSS stylesheet. If there is a typographical error in the name,  the HTML will not link to the CSS, like in this code:

<head>
<!– This will not work. Did you spot the mistake? –>
<link rel=”stylesheet” type=”text/cs” href=”test.css”>
</head>

The error from the code block is “text/cs” (with no quotes). You should spell it as “text/css” (with no quotes).

<head>
<link rel=”stylesheet” type=”text/css” href=”myCSSFile.css”>
</head>

– Path Error

This is a tough one, and it’s difficult to get for the first time. Before you learn what it’s all about, we will define the following:

  • What is a path?
  • Types of path

Furthermore, a path is a location of a resource on your computer or a web server. There are two types of paths. They are:

  • Relative paths: The location of a resource starting with a forward slash
  • Absolute paths: These are URL locations

A path error occurs when you are connecting CSS to HTML using the wrong path.

For example, if your CSS is in FolderA and your HTML is in FolderB. The following won’t work:

<head>
<!– If HTML and CSS are in different folders, this
will not work –>
<link rel=”stylesheet” type=”text/css” href=”FolderA/myCSSFile.css”>
</head>

The path to get the CSS would be:

<head>
<link rel=”stylesheet” type=”text/css” href=”../FolderA/myCSSFile.css”>
</head>

Another example is, if your CSS file is in FolderA. This FolderA resides in FolderZ. If you need to fetch the CSS file in FolderA, you’ll need the following:

<head>
<link rel=”stylesheet” type=”text/css” href=”../FolderZ/FolderA/myCSSFile.css”>
</head>

When your CSS fails, take note of the path, an error can slip in without you even realizing.

Can you spot the error below? If yes, can you fix it?

<head>
<link rel=”stylesheet” type=”text/css” href=”./FolderZ/FolderA/myCSSFile.css”>
</head>

– Wrong Folder Name

If your CSS is in a folder, you’ll need the correct name of that folder when you want to link the CSS with the HTML. When the folder name is incorrect, it will result in CSS link not working.

For example, let’s say your CSS is in a folder called “indigo” (with no quotes), the following code will fail to get the CSS:

<head>
<link rel=”stylesheet” type=”text/css” href=”índigo/myCSSFile.css”>
</head>

Take a careful look at the folder name. Can you spot the error?

When your CSS files are in a folder, ensure you use the correct folder name when you are linking the CSS to HTML. Always double-check your file name when debugging HTML and CSS not linking issues

– Wrong File Name

The wrong CSS file name is one of the root causes when your CSS fails to link to your HTML. It can take countless hours to figure out this type of error.

When there is a wrong CSS file name, your HTML will consider it as a non-existent file. So, the web browser will use its user agent (UA) styles on the web page.

Don’t forget to always double-check your file name, to avoid such errors.

– CSS Syntax Errors

If there is a CSS syntax error in your CSS file, the web browser will not apply the CSS to your HTML file.

Some of the most common syntax errors are:

  • Missing semicolons at the end of a property-value declaration
  • Missing closing brace

– Wrong CSS Selector

When your HTML is set up with HTML IDs and classes, any attempt to use a class selector to get an HTML ID will not work, like in the code below:

<div class=”className”>
<p>
Your text
</p>
</div>/* This will not work */
#className {
width: 500px;
background-color: red;
}
In this scenario, you’ll need a class selector:
.className {
width: 500px;
background-color: red;
}

– Trailing Characters in Your CSS Selectors

This is a hard one to spot. As a challenge, see if you can spot the difference in the code blocks below:

.selector, {
display: grid;
place-items: center;
border-radius: 20px;
cursor: pointer;
width: 300px;
height: 50px;
background-color: #cccccc;
}
.selector {
display: grid;
place-items: center;
border-radius: 20px;
cursor: pointer;
width: 300px;
height: 50px;
background-color: #cccccc;
}

Did you spot it? We bet you did not.

The first CSS selector has a trailing comma in the selector name. As a result, this will prevent the browser from applying the styles. The fix is to pay a closer look at your CSS. Better yet, you can use an editor that’ll notify you of this error.

It is a best practice to document your code. In CSS, you write your comment in the following way:

You should know if you delete one part of the comment, everything will seem alright. But, know that the web browser will not apply CSS styles below the second part, i.e. below “*/” as in the coding block below:

main {
display: flex;
justify-content: center;
background-color: red;
}
*/
.display-grid {
display: grid;
place-items: center;
border-radius: 20px;
}

From the code above, the web browser will apply styles for the main selector. It will not apply the styles of .display-grid due to the trailing comments fragment.

The fix is to use an editor that’ll always delete both comment fences.

– You Forgot To Save Your Files

Yeah, I know, this one is common. When there is a change in your CSS file, always save your files before you refresh the web browser.

Conclusion

In this article, you learned about thirteen errors that will prevent your CSS from working on your web page. Here is a summary of what you’ve learned:

  • How you can link CSS to HTML
  • What will stop your CSS from working on your HTML page
  • Thirteen reasons that will cause your CSS not to link with your HTML, like not using the right linking tag, path errors, syntax errors, and others
  • How to fix the common reasons that will stop your CSS from working

Css not linking to htmlWith the new knowledge that you’ve gained, you’ve surely leveled-up your CSS debugging skills.

  • Author
  • Recent Posts

Position is Everything

Your Go-To Resource for Learn & Build: CSS,JavaScript,HTML,PHP,C++ and MYSQL. Meet The Team

Position is Everything

Верстка. Дизайн. Раскрутка. Тема для споров

Модератор форума


Сообщение # 1 |
01:21:27
28 Июл 2010

Это НЕ тема для вопросов и помощи по вашим сайтам!
Если что-то не получается, пишите в соответствующие темы.

Для чего эта тема?

  • Тема для творческих споров по дизайну, верстке, адаптации дизайна сайта под браузеры, а так же о продвижении вашего творения в свет
  • Это свободная тема для владельцев сайтов, где можно обсудить, поспорить и выяснить истину

Наболевшие темы:

  • IE — зло (нужно ли поддерживать старые версии при верстке?)
  • Firebug в помощь веб-разработчику!
  • А вы уже юзаете «Происпектировать элемент» в Opera?
  • HTML 5 — что за зверь?
  • Тенденции современного веб-дизайна (юзаем text-shadow и прочие плюшки?)
  • Продвижение сайта — это каждодневный труд или искусство

Тут можно поделиться друг с другом различными идеями и наработками по оптимизации кода сайтов под разные браузеры, обсудить наболевшие проблемы и спросить совета по проработке некоторых элементов дизайна.

Примечание:
В эту тему будет скидываться все что не входит в рамки других тем
С запросами: напишите мне скрипт, сделайте дизайн, хочу чтобы у меня было как на том сайте, раскрутите мне сайт сюда лучше не обращаться. Все подобные запросы и возможные ответы на них будут удаляться

olegsuv


Сообщений: 1365

Репутация: 127

Сообщение # 331 |
18:30:22
26 Мар 2012

Quote (Diоm)

но вот только эти теги увеличивают текст

Ну так задайте им свой размер.


Любые работы по:
— Javascript, jQuery, HTML, CSS
— Верстке макетов и установке их на сайты
— Нестандартным решениям

Diоm


Сообщений: 2

Репутация: 14

Уровень замечаний:

Сообщение # 332 |
18:33:31
26 Мар 2012

Если валидатор выдает 255 ошибок в html это что значит?

На мой взгляд если там и есть ошибки то ни как не 255.


Ведется набор персонала на Liverpool-Portal.ru

olegsuv


Сообщений: 1365

Репутация: 127

Сообщение # 333 |
18:34:32
26 Мар 2012

Quote (Diоm)

Если валидатор выдает 255 ошибок в html это что значит?

это значит что на сайте 255 ошибок


Любые работы по:
— Javascript, jQuery, HTML, CSS
— Верстке макетов и установке их на сайты
— Нестандартным решениям

Diоm


Сообщений: 2

Репутация: 14

Уровень замечаний:

Сообщение # 334 |
19:01:12
26 Мар 2012

Может ли этому быть виной то, что сайт в основном сверстан таблицами а не при помощи ЦСС?

http://opengt.ru/


Ведется набор персонала на Liverpool-Portal.ru

olegsuv


Сообщений: 1365

Репутация: 127

Сообщение # 335 |
19:02:24
26 Мар 2012

Diоm, вы бы в консоль сначала посмотрели:

Code

[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 7:
   #torinfo{width:530px; background-color:#9F9F9F; padding: 5 5 5 5; border-radius:
   ——————————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 7:
   enttxt {background-color:#E6E6E6; color:#000; margin-left:3px; padding: 3 3 3 3;
   ———————————————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
-moz-opacity is an unknown property
Line 71:
   opacity:0.7; -moz-opacity:0.7; filter:alpha(opacity=70);  
   —————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Declaration syntax error
Line 71:
   opacity:0.7; -moz-opacity:0.7; filter:alpha(opacity=70);  
   ———————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
-moz-opacity is an unknown property
Line 75:
   opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);  
   —————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Declaration syntax error
Line 75:
   opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);  
   ———————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
-moz-opacity is an unknown property
Line 81:
   opacity:0.5; -moz-opacity:0.2; filter:alpha(opacity=40);  
   —————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Declaration syntax error
Line 81:
   opacity:0.5; -moz-opacity:0.2; filter:alpha(opacity=40);  
   ———————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
-moz-opacity is an unknown property
Line 85:
   opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);  
   —————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Declaration syntax error
Line 85:
   opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);  
   ———————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 99:
   .mframe1 {padding:2 10 30 10px;}
   ——————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: cursor
Line 101:
   label {cursor:pointer;cursor:hand}
   ———————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 106:
   .menut {padding:2 3 3 15px;}
   —————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 107:
   .mframe {padding:2 0 30 30px;}
   ——————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: width
Line 108:
   .bannerTable {width:468;height:60;}
   ————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: height
Line 108:
   .bannerTable {width:468;height:60;}
   ———————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: color
Line 142:
   a.catName:link {text-decoration:none; color:c60000;}
   —————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: color
Line 143:
   a.catName:visited {text-decoration:none; color:c60000;}
   ——————————————————^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: color
Line 146:
   a.catNameActive:link {text-decoration:none; color: c60000;}
   ———————————————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: color
Line 147:
   a.catNameActive:visited {text-decoration:none; color: c60000;}
   ————————————————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: padding
Line 202:
   .commReg {padding: 10 0 10 0px; text-align:center;}
   ——————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid value for property: background
Line 237:
   .calMdayIs {color:#C04141;background:#CFCFCF1;font-weight:bold;border:1px solid  
   ———————————————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Invalid id selector
Line 570:
   solid #4e4e4e;}  
   ————-^
[26.03.2012 18:01:51] CSS — http://opengt.ru/_st/my.css
Linked-in stylesheet
Selector syntax error
Line 575:
   .tabset_tabs { margin-left:3px; padding:0; list-style-type:none; position:relati
   —————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-moz-user-select is an unknown property
Line 38:
   .x-unselectable {-moz-user-select:-moz-none;}
   ———————————-^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-moz-user-select is an unknown property
Line 39:
   .x-selectable {-moz-user-select:text}
   ———————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
Declaration syntax error
Line 74:
   .xw-dragging .xw-tl {opacity:0.7;filter:Alpha(Opacity=’70’);}
   ————————————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
Declaration syntax error
Line 93:
   .xw-blank {background:#a3bae9;opacity:0.4;filter:Alpha(Opacity=’40’);overflow:hi
   ———————————————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
Declaration syntax error
Line 95:
   background:#000000 url(‘/.s/img/1px.gif’);opacity:0.25;filter:alpha(opacity=25);
   ———————————————————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-moz-user-select is an unknown property
Line 101:
   .myWinCont {overflow:hidden;-moz-user-select:text}
   ———————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-moz-user-select is an unknown property
Line 189:
   .u-tabc-content {overflow:auto;-moz-user-select:text}
   ————————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
«::» not followed by known pseudo element
Line 197:
   .u-comboedit::-moz-focus-inner { border: 0; }
   ——————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-moz-border-radius is an unknown property
Line 215:
   -decoration:none; font-size:12px; border: #A3BAE9 1px solid; -moz-border-radius:
   ———————————————————————————^
[26.03.2012 18:01:51] CSS — http://s15.ucoz.net/src/layer1.css
Linked-in stylesheet
-webkit-border-radius is an unknown property
Line 215:
   12px; border: #A3BAE9 1px solid; -moz-border-radius: 3px; -webkit-border-radius:
   ———————————————————————————^
[26.03.2012 18:01:52] CSS — http://opengt.ru/
HTML style attribute
Declaration syntax error
Line 1:
   filter:alpha(opacity=80); opacity:0.8
   ————————-^
[26.03.2012 18:01:52] CSS — http://opengt.ru/
HTML style attribute
Declaration syntax error
Line 1:
   filter:alpha(opacity=80); opacity:0.8
   ————————-^
[26.03.2012 18:01:52] CSS — http://opengt.ru/
HTML style attribute
Declaration syntax error
Line 1:
   filter:alpha(opacity=80); opacity:0.8
   ————————-^
[26.03.2012 18:01:52] CSS — http://opengt.ru/
HTML style attribute
Declaration syntax error
Line 1:
   filter:alpha(opacity=80); opacity:0.8
   ————————-^


Любые работы по:
— Javascript, jQuery, HTML, CSS
— Верстке макетов и установке их на сайты
— Нестандартным решениям

Diоm


Сообщений: 2

Репутация: 14

Уровень замечаний:

Сообщение # 336 |
19:02:43
26 Мар 2012

И вообще, сильно ли это влияет на поисковики?


Ведется набор персонала на Liverpool-Portal.ru

olegsuv


Сообщений: 1365

Репутация: 127

Сообщение # 337 |
19:03:41
26 Мар 2012

Quote (Diоm)

И вообще, сильно ли это влияет на поисковики?

Я думаю что может влиять соотношение контент/разметка, по поводу ошибок — не слышал.


Любые работы по:
— Javascript, jQuery, HTML, CSS
— Верстке макетов и установке их на сайты
— Нестандартным решениям

Diоm


Сообщений: 2

Репутация: 14

Уровень замечаний:

Сообщение # 338 |
19:05:01
26 Мар 2012

Это типа лишнее в ЦСС и нужно удалить?


Ведется набор персонала на Liverpool-Portal.ru

olegsuv


Сообщений: 1365

Репутация: 127

Сообщение # 339 |
19:08:07
26 Мар 2012

Quote (Diоm)

Это типа лишнее в ЦСС и нужно удалить?

в html


Любые работы по:
— Javascript, jQuery, HTML, CSS
— Верстке макетов и установке их на сайты
— Нестандартным решениям

nad-x


Репутация: 0

Сообщение # 340 |
17:20:45
21 Апр 2012

Народ! Как думаете, слайдер, который перелистывается типа как на андроиде (мышкой в сторону, переходя на новый раб. стол) реально на jquery написать, или флэшем всё-таки проще?

Miss_Esq


Сообщений: 13859

Репутация: 4159

Уровень замечаний:

Сообщение # 341 |
17:28:29
21 Апр 2012

nad-x, поковыряйтесь может и найдёте jQuery , но пока что только Flash встречались …


geometriya ISO 3166-2 DEE

tellpeople


Репутация: 0

Сообщение # 342 |
21:11:27
21 Апр 2012

Всем доброго вечера.
Скажите пожалуйста, кто как относится к такому дизайну, я на сайте вместо шапки сделал блок 90 пикселей высотой и в него сунул облако тегов не на флэше. Стандартный информер. Не знаю поддержат меня или нет, но я считаю что так можно отразить суть тематики сайта, а тематика законодательство и общество.
Жду ваших комментариев по такой задумке. Может кто-нибудь еще что-то посоветует или поправит в чем то.


Законы, кодексы, права, защита, жалобы — TellPeople.ru

webanet


Сообщений: 24067

Репутация: 4985

Сообщение # 343 |
23:46:10
21 Апр 2012

tellpeople, вы большой и рисковый оригинал однако, забивать верхнюю часть кода этими красотами

Quote

<div id=»logoBlock»><noindex><a style=»font-size:8pt;» href=»/search/%D0%BA%D0%B0%D1%87%D0%B5%D1%81%D1%82%D0%B2%D0%B0/» rel=»nofollow»

смело. очень смело
можно кстати сделать сайт вообще без шапки, если не знаете что туда воткнуть. это будет намного лучше чем то что есть


ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/

tellpeople


Репутация: 0

Сообщение # 344 |
23:51:57
21 Апр 2012

webanet, а я подумал что noindex наоборот спасает от мусорки которая получается из тегов.


Законы, кодексы, права, защита, жалобы — TellPeople.ru

webanet


Сообщений: 24067

Репутация: 4985

Сообщение # 345 |
23:55:57
21 Апр 2012

tellpeople, зачем вам мусорка в самом вверху кода? какой в этом сакральный смысл?


ТУТ можно оставить своё мнение по любому вопросу
https://webanetlabs.net/

Photo from Unsplash

When working with HTML and CSS, you may find that your CSS is not styling your HTML document even when you’ve added the CSS to your page.

Here are six fixes that you can try to make your CSS work on your HTML page

Make sure that you add the rel attribute to the link tag

When you add an external CSS file to your HTML document, you need to add the rel="stylesheet" attribute to the <link> tag to make it work.

<link rel="stylesheet" href="style.css" />

If you omit the rel attribute from the <link> tag then the style won’t be applied to the page.

Make sure you have the correct path in the href attribute

If you have the CSS file in the same folder as the HTML document, then you can add the path to the CSS file directly as shown below:

<link rel="stylesheet" href="style.css" />

If you add a / before the file name, the CSS won’t be applied:

<link rel="stylesheet" href="/style.css" />
<!-- this is wrong -->

When your CSS is one folder away, you need to specify the folder name inside the href attribute without the / as well.

This is wrong:

<link rel="stylesheet" href="/assets/style.css" />

This is correct:

<link rel="stylesheet" href="assets/style.css" />

Make sure the CSS file name is correct

The name of the CSS file that you put inside the href attribute must match the actual name of the CSS file.

If you have a CSS name with spaces, then you need to include the spaces in a URL-safe format by replacing it with %20

For example, suppose the name of your CSS file is my style.css, then here’s the correct name inside the href attribute:

<link rel="stylesheet" href="my%20style.css" />

Because URL can’t contain spaces, it’s recommended that you replace all spaces in your CSS file with a hyphen - or an underscore _ so that my style.css becomes my-style.css or my_style.css.

Make sure the link tag is at the right place

The <link> tag that you used in your HTML file must be a direct child of the <head> tag as shown below:

<head>
  <link rel="stylesheet" href="style.css" />
</head>
<body>
  <h1>Hello World</h1>
</body>

If you put the <link> tag inside another valid header tag like <title> or <script> tag, then the CSS won’t work.

The following example is wrong:

<head>
  <title>
    <link rel="stylesheet" href="STYLE.css" />
  </title>
</head>
<body>
  <h1>Test page</h1>
</body>

The external style CAN be put inside the <body> tag, although it’s recommended to put it in the <head> tag to load the style before the page content.

The following example still works:

<body>
  <link rel="stylesheet" href="STYLE.css" />
  <h1>Test page</h1>
</body>

Make sure that all your style rules are correct

When you have an invalid CSS syntax inside your stylesheet, then the browser will ignore the invalid syntaxes and apply the valid ones.

For example, suppose you have the following CSS file:

body {
  background-color: greenyellow;
}

h1 {
  color: choco;
}

Because browsers have no support for choco color name, the style rule for <h1> tags above will be ignored while the background-color property for the <body> tag will be applied.

Make sure that you are using the right syntax for your styling because invalid CSS syntax won’t generate an error message.

Invalidate the cache with a hard reload

Sometimes, you might have the CSS file linked correctly from your HTML file, but you don’t see the changes you make to the CSS file reflected on the web page.

This usually happens when the browser serves a cached version of your CSS file.

To invalidate the cache and serve the latest version of your CSS file, you can perform a hard reload on the browser.

The shortcut to perform a hard refresh might vary between browsers:

  • For Edge, Chrome, and Firefox on Windows/ Linux, you need to press Shift + CTRL + R
  • For Edge, Chrome, and Firefox on macOS, you need to press Shift + CMD + R
  • For Safari, you need to empty caches with Option + CMD + E or click on the top menu Develop > Empty Caches

If you’re using Chrome, you can also select to empty the cache and perform a hard reload with the following steps:

  • Open the Chrome DevTools by pressing Shift + CTRL + J on Windows/ Linux or Option + CMD + J on Mac.
  • Right-click on the reload (refresh) icon and select the third option

The image below shows the Chrome Empty Cache and Hard Reload option you need to select:

With that, you should see the latest CSS changes reflected on your web page.

Alternatively, you can also invalidate the browser cache by using CSS versioning as explained here:

CSS versioning trick explained

And those are the six fixes you can try to link your CSS file to your HTML document.

I hope this tutorial has helped you fix the issue 👍

Понравилась статья? Поделить с друзьями:

Интересное по теме:

  • Link ошибка сервера
  • Link2ea ошибка стим
  • Link2ea sims 4 ошибка
  • Link 1168 c ошибка
  • Linhof холодильник автомобильный ошибки

  • Добавить комментарий

    ;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: