3.2.0

setting font in popup window

I'm having difficulties in not being able to set the font properties in a combo popup window. I'm using CSS and other properties are working fine.

.obj-popup {top:0px;height:400px;width:400px;font:bold;}

I'm actually trying to set the font to be monospaced due to the data inside it. Bold is my latest attempt. It seems that whatever property is applied to the font, nothing happens.

I've tried the other CSS attributes as well with no luck.
Myshka
March 12,
Clarification:

#.obj {....; font:courier;} <- this works fine!

#.obj-popup {....;font courier;} <- this does not work :(

When an element is selected from the popup list back to the main combo, it shows properly with proper spacing. Trying to get some simple columns:

001 Peanut Butter Yummy
002 Jelly Not Yummy
Myshka
March 12,
It appears you're not not using the CSS selector syntax correctly. Read this to understand the differences first -
http://www.w3.org/TR/CSS2/selector.html
and learn what # and . refer to.

font:font-name is the correct syntax. You may also need to add !important immediately after the font name to override the default AW ones in some cases.
Anthony
March 12,
My posting was bad. The problem still persists. The correct example is

#obj {....; font:courier;} <- this works fine!

#obj-popup {....;font courier;} <- this does not work :(

Where obj is the object that is the actual text box portion of AW.UI.Combo. The display of the text inside here, once the item has been selected is properly spaced.

The popup list; however, is not spaced the same. I'm very much wanting the popup list to have the same font and spacing as the textbox.

Bill
Myshka
March 14,
I have never been able to define the font in the popup with standard css, instead I have used the following on the control itself:

_UISE1_.getPopupTemplate().setStyle("width","300");
_UISE1_.getPopupTemplate().setStyle("height","300");
_UISE1_.getPopupTemplate().getItemTemplate().setStyle("font-size","18px");
_UISE1_.getPopupTemplate().getItemTemplate().setStyle("height","26px");
_UISE1_.getContent("box/text").setStyle("font-size", "18px");
_UISE1_.getContent("box/text").setStyle("text-align", "top");
_UISE1_.getContent("box/text").setStyle("border", "none")
Erik Dobrie
March 16,
Here is an aprox. css-js combo styles-comparsion to play with.
Just comment/uncomment css or it's corresponding js code to check desired results ( not tested ) , but should be enough as start point.
HTH

<script> 
var obj = new AW.UI.Combo;
obj.setId('comboID');
obj.setControlText("Combo");
obj.setControlImage("favorites");
obj.setItemText(["Home", "Favorites", "Font size", "Search"]);
obj.setItemCount(4);
</script> 

<style>
 #comboID {width: 400px; height: 42px; font-size: 18px } 
</style>
<script> 
obj.setStyle("width","400");
obj.setStyle("height","42");
obj.setStyle("font-size", "18px");
</script> 

<style>
 #comboID .aw-box { background: #fca } 
</style>
<script> 
obj.getContent("box").setStyle("background", "fca");
</script> 

<style>
 #comboID .aw-box-text { font-size: 18px; text-align: top } 
</style>
<script> 
obj.getContent("box/text").setStyle("font-size", "18px");
obj.getContent("box/text").setStyle("text-align", "top");
</script>  

<style>
    #comboID-popup {width: 400px; height: 300px; background: #fca}
</style>    
<script>
obj.getPopupTemplate().setStyle("width","400");
obj.getPopupTemplate().setStyle("height","300");
obj.getPopupTemplate().setStyle("background","fca");
</script>

<style>    
#comboID .aw-item {height: 42px; } 
</style>
<script>
obj.getPopupTemplate().getItemTemplate().setStyle("height","42px");
</script>
    
<style>    
#comboID .aw-item-text {font-size: 18px } 
</style>
<script>
obj.getPopupTemplate().getItemTemplate().getContent("box/text").setStyle("font-size","18px");
</script>

<script>
document.write(obj);
</script>
Carlos
March 16,
After some testing, the actual Style property is "font-family". This works nicely.


obj.getPopupTemplate().getItemTemplate().getContent("box/text").setStyle("font-family","Courier");
Myshka
March 22,

This topic is archived.

See also:


Back to support forum