Do Double Forward Slashes Direct Ie to Use Specific CSS

Do double forward slashes direct IE to use specific css?

// is not a valid CSS comment.

Browsers that parse CSS properly will ignore //position because //position is not a valid property name (details are here, property -> IDENT S* -> follow it through).

This only works in IE7 due to its well known bug of accepting properties with junk prepended to them.

It's not just // that works. IE7 will have red text here:

body {
    !/!*//color: red;
}

This is most typically exploited with *, for example *display: inline; as part of the display: inline-block workaround for IE7.

Is it bad practice to comment out single lines of CSS with //?

I don't know how future and/or exotic browsers will interpret non-official hacks like //, so I’d rather stick with the appropriate notation:

li {
    float:left;
    text-indent:0px;
    /* list-style-type:none; */
}

Inline block doesn't work in internet explorer 7, 6

In IE6/IE7, display: inline-block only works on elements that are naturally inline (such as spans).

To make it work on other elements such as divs, you need this:

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

*display: inline uses a "safe" CSS hack to apply to only IE7 and lower.

For IE6/7, zoom: 1 provides hasLayout. Having "layout" is a prerequisite for display: inline-block to always work.

It is possible to apply this workaround while keeping valid CSS, but it's not really worth thinking about, particularly if you're already using any vendor prefixed properties.

Read this for more information about display: inline-block (but forget about -moz-inline-stack, that was only required for the now ancient Firefox 2).

jsfiddle not working or my css/html?

Seems like the problem is with the comments you've added in a wrong syntax for CSS.

Here is a fixed code working on jsfiddle

@import url('https://fonts.googleapis.com/css?family=Kumar+One');

a{
  text-decoration: none;
  font-family: 'Kumar One', cursive;
}

.container{
  display: flex;
  justify-content: space-around;
  list-style-type: none;
}

.item{
  width: 8em;
  text-align: center;
  background-color: #10999e;
}

.item:hover{
  background-color: #0b6c70;
} 

table-cell word-wrap not working with slashes

Add table-layout:fixed; to the "table" div-element and assign a width to the cell to make it break lines:

JSFiddle

Adding a slash after just the first link in an UL

It looks like you were targeting the first child within the li's themselves.

Try the below.

li:first-child a:after {

  content: "/";

}

<ul>

  <li>

     <a class="language-nav__link" href="#">

         English

     </a>

  </li>

  <li>

      <a class="language-nav__link" href="#">

         Spanish

      </a>

  </li>

  <li>

      <a class="language-nav__link" href="#">

         Chinese

      </a>

  </li>

</ul>

Why are some of my CSS rules not working?

CSS Commenting: Use /* ... */ not //... or <!-- ... -->

The problem you're having is not related to your flex code.

The problem is you're using line comment syntax for commenting out text, and this is not valid CSS.

button:ACTIVE { // feedback on touch modal
   background: aqua;
}

// next is for images
.img { width: 8vmin; }

So what you're actually doing is posting invalid code which, instead of commenting out the line, is calling CSS error-handling into play, which kills the next rule. In other words, any rule following your // text text text is ignored, just as if you had done this: xheight: 50px.

This is why order is not working for your icon:

// stuff living in #no
#info-div1 {
    order: 3;
    -webkit-order: 3;
}

Stick to the standard CSS commenting method. Start a comment with /*. End a comment with */.

/* stuff to be commented out */

Once you make the adjustments in your code, the order property works fine (and, as you might expect, other changes occur, caused by previously ignored code). See revised demo.

Read more about CSS comments here:

• 4. Syntax and basic data types > Section 4.1.9 Comments ~ W3C
• Is it bad practice to comment out single lines of CSS with //?
• Do double forward slashes direct IE to use specific css?
• Single Line Comments (//) in CSS ~ Tab Atkins, Jr., CSS Working Group

---

Lastly, on a separate note:

You're placing vendor prefixed code after the standard unprefixed versions.

#container {
    flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;

    justify-content: center;
    -webkit-justify-content: center;

    align-items: center;
    -webkit-align-items: center;

    align-content: space-between;
    -webkit-align-content: space-between;
}

You should consider reversing this. The unprefixed (W3C) version should go last, so it's always the preferred version in the cascade. Read more.

Avoiding mixed secure/insecure warning with https iframe on IE

Use the The protocol-relative URL on your offending urls to avoid this issue in IE.

So, instead of calling a js/image/css by using its full path, e.g. including the http/s protocol, you call it simply by using a double slash, //, so your content (what i like to think) "inherits" the protocol scheme of its former.

CSS root directory

/Images/myImage.png

this has to be in root of your domain/subdomain

http://website.to/Images/myImage.png

and it will work

However, I think it would work like this, too

• images
  
  
  • yourimage.png
• styles
  
  
  • style.css

style.css:

body{
    background: url(../images/yourimage.png);
}

---

Related Topics