Inline CSS (Object Tag)

Inline CSS


If you require more CSS control on your Google Sites . It is possible to embed Inline CSS directly into your Google Sites Pages. 

The Google Sites inline CSS must be wrapped in a <Object> tag.

Inline CSS Advantages

  • Better CSS Control
  • Cleaner and more reader friendly HTML Code
  • Reduction of Filesize (When Rendered Exactly. Even smaller when Minified and Gzipped in a CSS file)

Inline CSS is widely supported by Chrome or Firefox Browsers.

Inline CSS - Embedded Gadget:

Here is an example of the CSS using the <Object> tag.

Inline CSS Code

<object xmlns="http://www.w3.org/1999/xhtml">
<style type="text/css">
div.toolbar
{
background-color:#005c9c;
color: #fff;
font-weight: bold;
padding:8px;
}
select {
background-color:#EEE;
font-size:10px;
color:#696969;
font-weight: bold;
align:center;
margin:15px 15px 15px 15px ;
}
div.links
{
font-size:12px;
text-decoration:None;
background-color:#fff;
border-bottom: 1px solid #999;
border-left: 1px solid #CCC;
border-right: 1px solid #999;
border-top: 1px solid #CCC;
padding:3px 5px 0px 5px;
margin:15px 15px 15px 15px ;
display:inline;
}
</style>
<div class="toolbar">
Toolbar Title:
<div class="Links">
<a href="">Link 01</a>
<a href="">Link 02</a>
</div>
<select><option>Option 01<options><option>Option 02<options></select>
</div>
</object>