How can CSS be applied to components from Google Closure Library?
Posted
by Jason
on Stack Overflow
See other posts from Stack Overflow
or by Jason
Published on 2009-12-26T13:32:53Z
Indexed on
2010/03/19
0:31 UTC
Read the original article
Hit count: 373
google-closure-library
|JavaScript
I'm getting my feet wet with Google's Closure Library. I've created a simple page with a Select Widget, but it clearly needs some styling (element looks like plain text, and in the example below the menu items pop up beneath the button).
I'm assuming the library supports styles -- how can I hook into them? Each example page in SVN seems to use its own CSS.
Abbreviated example follows:
<body>
<div id="inputContainer"></div>
<script src="closure-library-read-only/closure/goog/base.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.ui.Button');
goog.require('goog.ui.MenuItem');
goog.require('goog.ui.Select');
</script>
<script>
var inputDiv = goog.dom.$("inputContainer");
var testSelect = new goog.ui.Select("Test selector");
testSelect.addItem(new goog.ui.MenuItem("1"));
testSelect.addItem(new goog.ui.MenuItem("2"));
testSelect.addItem(new goog.ui.MenuItem("3"));
var submitButton = new goog.ui.Button("Go");
testSelect.render(inputDiv);
submitButton.render(inputDiv);
</script>
</body>
© Stack Overflow or respective owner
