top

Defining CSS Contents

Published 2014-10-28 | (Compatible with SDK 2.5,3.5,4.5,5.0,5.1 and 2011,2012,2013,2014 models)

Defining CSS Contents

When designing your Smart TV application, you must also carefully consider the CSS definitions. In addition to the issues listed below, consider minimizing the initial entry speed of your application by loading the CSS background image on demand.

Setting Display Margins

The element created in the margin beyond the maximum TV resolution (960x540 pixel) can cause the display to scroll. All the element margins and paddings in the index.html file file should be defaulted to ‘0’ to prevent the matter resulted from going beyond the area. The CSS file must contain the following strings:

body {
    margin: 0;
    padding: 0;
    background-color: transparent;
}

Handling CSS text-overflow

The browser supports CSS1 and CSS2. In addition, the browser supports the text-overflow attributes from CSS3, which makes the browser cope efficiently with contents over the area.

Setting Letter Spacing

By default, the letter-spacing value in the browser is ‘-1’.

In the case of Thai language, letters are overlapped when the value is ‘-1’. Set the value ‘0’ to prevent this from happening by including the code below in the CSS file:

* {
    letter-spacing: 0px;
}