Caleb Caleb - 5 months ago 22
CSS Question

CSS code not affecting HTML document

I promise I've looked for an answer on here before asking.

I'm in an HTML course at school, and our final project for the unit is to make a multi framed webpage. In the main.htm file, I want the description to say "About" while facing on a 90 degree angle to the left of the text. I looked online, and it needs to use CSS, no problem, so I go to W3 Schools to find out how to properly use CSS. The problem is the notepad doc I'm using ignores the CSS completely.

Here's the code:



<!DOCTYPE html>
<HTML>

<HEAD>
<STYLE>
body {
Background-color: #ffffff Font-Family: "Tw Cen MT";
}
h1 {
-ms-transform: rotate(-90deg);
filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3);

}
</STYLE>
</HEAD>

<BODY>

<h1>The Pawnshop</h1>
<h3>is a buy and sell eccomerse site. Send us information if you want to sell, or check out our store
page if you're looking to buy.<h3>

</BODY>
</HTML>






The odd thing is when I test it online, and even when I try it in the code snippit, it works perfectly (aside from the sideways text being in the center which is a non-issue for now).

I'm editing in a notepad document and testing in Internet Explorer 10.

Answer

You will need to include -webkit-transform, -o-transform, -moz-transform, transform for other browsers to support transform

    
    body {
      background-color: #ffffff;
    font-family: "Tw Cen MT";
    }
    h1 {
      position:absolute;
      left:0px;
      Top:20px;
      width:300px;
      -webkit-transform: rotate(-90deg);
      -moz-transform: rotate(-90deg);
      -o-transform: rotate(-90deg);
      -ms-transform: rotate(-90deg);
      transform: rotate(-90deg);
      filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3);
      ​
    }
  <h1>The Pawnshop</h1>
  <h3>is a buy and sell eccomerse site. Send us information if you want to sell, or check out our store 
page if you're looking to buy.<h3>

Comments