Item font CSS

Hello
I'm using htmldb 2.0 and theme 7 for a html region with a form based on a table.
Is it possible to define one global setting (i.e. font-size, font-family) for all items, no matter if it is a selectlist or textarea etc.. I don't want to add the style-setting in HTML Form Element Attributes for every item.
I tried to customize a own updoaded CSS, but it worked only for the item labels, for which I found the classes, but not for the items itself.
thank you

Did you try a simple CSS snippet like
<style>
select option,input {font-family:whatever;font-size;whatever}
</style>Basically, just use the HTML tags as CSS selectors and style them as you need. You might need to tweak the selectors above, but you get the idea.
in the HTML Header (under Page Attributes).

Similar Messages

How to Make a "fonts.css" style sheet

Hi, I have a wordpress blog with a stylesheet named “style.css”. I want to change the fonts in the style sheet and so I want to create a separate style sheet named “fonts.css"
I could just duplicate the ”style.css” page and then rename it “fonts.css” but I believe I read somewhere it is better to create a new style sheet named “fonts.css” and then add my font styles to that. Doens anyone know of a tutorial or how I make the new style sheet and add my fonts?

I only typically use two stylesheets on any given site, layout.css and styles.css. One is for the overall layout/positioning info of the site and the other is the style information which would include fonts, colors, shadows, transitions, etc.
If it is better in your mind and for your workflow to create a third stylesheet just for the font values, go for it. To me, fonts are just another style element though, so they stay in my styles.css file.
There's really no right or wrong to doing it either way. Just make sure you create another link in the head section of your site to the new file if you create fonts.css.
Thanks jon,
Yes I agree, I could just change the fonts in “style.css” and then have less style sheets, but the themes developer told me to create a new style sheet named “fonts.css” only because the theme is updated regularly and uploading a new theme will write over the file named “style.css” and then your fonts will default to their original fonts.
I don't see anything wrong with that approach. Just remember that if you have both styesheets linked to the same page then the page will get it's css styles from the last linked stylesheet.
So for instance if you have:
body {
font-size: 14px ;
in the style.css
and
body {
font-size: 12px ;
in the fonts.css
and the last linked stylesheet was styles.css the page would display 14px text.
So you just need to get them in the right order IF you have more than one styleshet linked to a page.
Thanks Osgood,
Yes that was my other question. So in my uploaded CSS folder I have the original “style.css” file and now my new “fonts.css” file. “style.css” is above the “fonts.css” file and both contain the same information except the file “fonts.css’ has been changed to use different fonts.
So if I understand you correctly I need to either move the file “fonts.css" above the file “style.css” or delete “style .css” from the CSS folder so the file “fonts.css” will take precedence. Is this correct?
Also, I needed to open style.php and edit the code to include “fonts.css” which I did.
I opened "style.php" and then added the code in "red" then uploaded it to the (CSS) folder on the server.
<?php
header( "Content-type: text/css" );
$files = array();
$files[] = 'style.css';
$files[] = 'responsive.css';
$files[] = 'fonts.css';
foreach($files as $file) :
    $content = @file_get_contents( $file );
    echo minify( $content );
endforeach;
function minify( $code ) {
          $code = preg_replace( '#\s+#', ' ', $code );
          $code = preg_replace( '#/\*.*?\*/#s', '', $code );
          $code = str_replace( '; ', ';', $code );
          $code = str_replace( ': ', ':', $code );
          $code = str_replace( ' {', '{', $code );
          $code = str_replace( '{ ', '{', $code );
          $code = str_replace( ', ', ',', $code );
          $code = str_replace( '} ', '}', $code );
          $code = str_replace( ';}', '}', $code );
          return trim( $code );
?>
After doing all of this I still didn’t see any changes to my fonts so I must have done something wrong.
Any ideas?

SelectManyCheckbox item font

I'm having a problem making the item text bold in a selectManyCheckbox. I have defined a css style:
af|selectManyCheckbox::item-text.debtProvidercheckbox
font-weight:bold;
In my jspx, I set the checkbox sytle as:
<af:panelGroupLayout layout="horizontal">
<af:panelGroupLayout layout="vertical">
<af:selectManyCheckbox value="#{pageFlowScope.backing_wizard_bean.medicalDebtTypes}"
simple="true"
styleClass="debtProvidercheckbox">
<f:selectItems value="#{bindings.MajorDebtTypeDebtOriginationTypeROView.items}"/>
</af:selectManyCheckbox>
</af:panelGroupLayout>
The checkbox item text displays as normal font weight.

I solved it.
my css style is:
af|selectManyCheckbox.providercheckbox::item-text
font-weight:bold;
my jspx is:
<af:panelGroupLayout layout="vertical"
id="consumerPanelGroupLayout">
<af:selectManyCheckbox value="#{pageFlowScope.backing_wizard_bean.consumerTypes}"
simple="true"
styleClass="providercheckbox"
id="consumerId">
<f:selectItems value="#{bindings.ConsumerROView.items}"/>
</af:selectManyCheckbox>
</af:panelGroupLayout>

Library item and CSS

This is a multi-part message in MIME format.
------=_NextPart_000_006D_01C6ACBA.1BE3DB50
Content-Type: text/plain;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
I need to build a CSS enabled navigation bar and make it a
library item =
in dreamweaver.
My question is I want to put the CSS code right above the
menu bar in a =
block of code that will all be included in the library code.
Can I do =
this with CSS without the <style> tags being placed in
the head of the =
page?
Thanks
Scott Powell
------=_NextPart_000_006D_01C6ACBA.1BE3DB50
Content-Type: text/html;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN">
<HTML><HEAD>
<META http-equiv=3DContent-Type content=3D"text/html; =
charset=3Diso-8859-1">
<META content=3D"MSHTML 6.00.2900.2912"
name=3DGENERATOR>
<STYLE></STYLE>
</HEAD>
<BODY bgColor=3D#ffffff>
<DIV><FONT face=3DArial size=3D2>I need to build
a CSS enabled =
navigation bar and=20
make it a library item in
dreamweaver.</FONT></DIV>
<DIV><FONT face=3DArial
size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>My question is I
want to put the CSS =
code right=20
above the menu bar in a block of code that will all be
included in the =
library=20
code. Can I do this with CSS without the
<style> tags being placed =
in the=20
head of the page?</FONT></DIV>
<DIV><FONT face=3DArial
size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial
size=3D2>Thanks</FONT></DIV>
<DIV><FONT face=3DArial size=3D2>Scott
Powell</FONT></DIV></BODY></HTML>
------=_NextPart_000_006D_01C6ACBA.1BE3DB50--

This is a multi-part message in MIME format.
------=_NextPart_000_0387_01C6AD63.F7A6A920
Content-Type: text/plain;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
>>>I need to build a CSS enabled navigation bar and
make it a library =
item in dreamweaver.
Why not make it a Server Side Include instead and avoid all
the =
maintenance hassles of Library items?
>>>My question is I want to put the CSS code right
above the menu bar in =
a block of code that will all be included in the library
code. Can I do =
this with CSS without the <style> tags being placed in
the head of the =
page?
Yes, by defining the styles inline but you're better off
setting up your =
CSS as a separate file then linking to it from the head of
the page.
--=20
Regards
John Waller
------=_NextPart_000_0387_01C6AD63.F7A6A920
Content-Type: text/html;
charset="iso-8859-1"
Content-Transfer-Encoding: quoted-printable
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0
Transitional//EN">
<HTML><HEAD>
<META http-equiv=3DContent-Type content=3D"text/html; =
charset=3Diso-8859-1">
<META content=3D"MSHTML 6.00.2900.2912"
name=3DGENERATOR>
<STYLE></STYLE>
</HEAD>
<BODY bgColor=3D#ffffff>
<DIV><FONT face=3DArial size=3D2>
<DIV><FONT face=3DArial
size=3D2>>>>I need to build a CSS =
enabled=20
navigation bar and make it a library item in
dreamweaver.</FONT></DIV>
<DIV><FONT face=3DArial
size=3D2></FONT> </DIV>
<DIV>Why not make it a Server Side Include instead and
avoid all the =
maintenance=20
hassles of Library items?</DIV>
<DIV> </DIV>
<DIV><FONT face=3DArial
size=3D2>>>>My question is I want to =
put the CSS=20
code right above the menu bar in a block of code that will
all be =
included in=20
the library code. Can I do this with CSS without the
<style> tags =
being=20
placed in the head of the
page?</FONT></DIV></FONT></DIV>
<DIV><FONT face=3DArial
size=3D2></FONT><FONT face=3DArial =
size=3D2></FONT><FONT=20
face=3DArial size=3D2></FONT><FONT face=3DArial
size=3D2></FONT><FONT =
face=3DArial=20
size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial size=3D2>Yes,
by defining the styles =
inline but=20
you're better off setting up your CSS as a separate
file then =
linking=20
to it from the head of the page.</FONT></DIV>
<DIV><FONT face=3DArial
size=3D2></FONT> </DIV>
<DIV><FONT face=3DArial
size=3D2></FONT><FONT face=3DArial =
size=3D2></FONT><FONT=20
face=3DArial size=3D2></FONT><FONT face=3DArial
size=3D2></FONT><FONT =
face=3DArial=20
size=3D2></FONT><BR>--
<BR>Regards</DIV>
<DIV><FONT face=3DArial
size=3D2></FONT> </DIV>
<DIV>John Waller</DIV></BODY></HTML>
------=_NextPart_000_0387_01C6AD63.F7A6A920--

System links from blog overall view to blog item without css???

Hi there,
Can anyone help me with the following really strange problem?
I’m struggling many hours with the system links in overall blog view but are not able to resolve the problem. Once you click in the overall blog view to a specific blog item the system is generating a new page bit without the CSS??? I have set a template page to the blog and if I’m using the preview it looks fine. The overall blog view as well the single post view. It seems that the system is not using the CSS from the template??? Is this a bug?
Good view’s:
Overall blog view: http://uitstootvrij.bitl.nl/_blog/uitstootvrij_nieuws
Single post view: http://uitstootvrij.bitl.nl/BlogRetrieve.aspx?BlogID=11720&PostID=363765
System link view: http://uitstootvrij.bitl.nl/_blog/uitstootvrij_nieuws/post/SEO_Rapport_rondvaart-branche_o penbaar_gemaakt/
Please help me out on this?
Awaiting you answer and many thanks
Rolf

Hi their Rolf
All these:
<link href="../assets/css/bootstrap.css" rel="stylesheet">
Anything like this, this is not what you do for BC to find the path.
BC has a very simple know from root structure so the above will simply be:
<link href="/assets/css/bootstrap.css" rel="stylesheet">
So any CSS source, script and image in templates and layouts need to start / and nothing else to know to read from the root.
Do that and it will sort this issue and when you use web apps, eCommerce and sub folder pages in the future too.

Saving Navigation Bar as Library Item with CSS working?

I have created a simple navigation bar with a separate color for "over" and saved it as a library item. A warning box indicates that the item may not work the same as the original as the CSS may not be copied. What is the simplest method for correcting this?

If your html docs are linked to an external stylesheet, they will get their styles from the CSS file.
http://alt-web.com/DEMOS/DW-Link-Stylesheet.shtml
I highly recommend using server-side includes instead of Library Items for menus. A server-side include file is easier to maintain by editing one file and uploading it to your server. With Library Items you must make changes to the Library Item and then re-publish all pages containing that item.
SSI's
http://www.smartwebby.com/web_site_design/server_side_includes.asp
More on SSI
http://forums.adobe.com/message/2112460#2112460
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Call Application Item in CSS

Hello,
Does anyone know if it is possible to call an application item in a css file, and if so is the proper format &F_ITEM. ?
Let me give you an example. Lets say I want the user to be able to change the text color, and so I set the application item, through some application means, and in the css I have something like:
body { text-color:&F_COLOR. ; }
is there a way to do this?
Thanks,
~Chris

Hi Chris,
I don't think you could do it from a css file as this is a static file. You could, however, have a page process that runs in the After Header process point and does something like:
BEGIN
htp.p ('<style type="text/css">');
htp.p ('body {color:' || v('F_COLOR') || ';}');
htp.p ('</style>');
END;This would add a style tag to the page but will allow your user to pick their colours.
Andy

DW menu item font problems Snow Leopard

I am having a problem in Dreamweaver with the font used for menu items. Out of PS, Fireworks, and Dreamweaver this is the only Adobe program where this problem is evident. I have tried many resolutions on the computer such as clearing font casche, diabling fonts, changing font charastics within DW, installing the latest PS font patch from apple, etc. If anyone has anything I can try to resolve this problem I would appreaciate it.

I've been using Lion since it's release, it's fine. Don't know what's holding you back.
Did you take a higher res screenshot and run it through what the font? From a glance I'm guessing at Conceilian outline, White Wolf. And upgrading won't solve this problem because the font will still reside on the system. An OS upgrade does not remove your custom fonts. It's going to be a process but you might just have to go through every outline font on your system.

Mail text viewing size versus sent item font size

Hi there,
I recently tried to increase the font size on my iMac Mail application so that I can read the messages in my inbox a bit clearer - and with great success! I found the section in the 'Fonts & Colors' tab of Mail Preferences and increased my message font to Helvetica size 18. However, various recipients of my emails have commented that the font size appears huge on their screens and print-outs.
Is there any way I can have the text bigger on my Mail app so that I can read everything without squinting (ideally the size 18 font I currently use) but automatically have my emails sent in Helvetica size 12 font so they don't look ridiculous to the recipients?
For your reference I am using iOS X Mavericks, version 10.9.5 on an iMac I bought late last year (2013). My Mail application is at version 7.3.
Thanks!

Thank you for responding. After investigating and checking further, it was clear that only one of your suggestions changes the font size of the list of emails, also called the In-box. And that is the display resolution.
However, changing the display resolution affects the dots per inch of everything, everywhere and makes it larger.
Given the high end fee Apple charges for their products, and the generally well developed software they provide, it is hard to imagine they have not corrected this obvious slight of effort on the inbox text. At times Apple's "one-size-fits-all" and "it's our way or no way" mentality astounds me and makes me want to run back to Microsoft.
Evidently this is a well known mistake, which has yet to receive any attention.
Again, thank you for your effort and assistance on my behalf.

When I select a menu item, the highlight is light blue and the item font color goes white. It is very difficult to read? Any solution?

When I select Bookmarks, the menu item (Bookmarks) is highlighted in light gray color; and the letters of the work itself (Bookmarks) turns white. This same thing happens when you go into individual bookmark selections. It is very difficult to read. Are there any alternatives that can be set by the user?

Are you using a standard Windows theme?
Start Firefox in [[Safe Mode]] to check if one of the add-ons is causing the problem (switch to the DEFAULT theme: Tools > Add-ons > Themes).
* Don't make any changes on the Safe mode start window.
See:
* [[Troubleshooting extensions and themes]]

LAF project : can I set the item prompt font through the CSS ?

Hi,
I'm implementing an application that is installed with multiple customers. I've added in the LAF jar and used the .GUIProperties to set the Item font and colours (so each customer can choose a LAF without rebuidling the system).
However, whilst this works, is there a way that I can set the Prompt properties using the .GUIProperties in the CSS - I can't see one (looking in the getContainerContent(Container ct)) part of the jar.
Is there a simple way of doing this ? (ie: set the prompts for the application through one call to the .GUIProperties in
PKG_LOOK_AND_FEEL.Set_GUI_Properties( '.GUIProperties1', 'LAF_BLOCK.LAF_BEAN' ) ;
TIA
Steve

Hello,
Please, don't ask question about the LAF on this forum. Send your questions to the corresponding email : [email protected]
Thank you in advance,
Francois

How to prevent RSS Viewer web part from overriding list-item CSS style?

I am using SharePoint Online. I have a web part page with a number of web parts with links. Font size of the links is ~12px.
If I add an RSS Viewer web part to the page, then it overrides the 'list-item' class CSS Style to something like 8px, which is unreadable.
To correct this I have tried the following:
1. Added the following code to a Script Editor Web Part on same page:
<style type="text/css">
.item link-item
font-size:20px !important;
.link-item
font-size:20px !important;
</style>
2. Completely deleted all XSL from the RSS Viewer web part and replaced it with very simple formatting code which format the links within the RSS web part to 16px - but still the other links are set to 8px.
3. Linked a custom style sheet to the relevant master page and set the link-item classes in there, ensuring that it is executed after the standard SharePoint css.
...but nothing works!
It appears that, as soon as the RSS Viewer web part is added to the page it overrides the list-item style and then will not release it even if all the XSL within the web part is deleted!
On deleting the RSS Viewer from the page and saving it, the links font size returns to normal.
Does anyone have a fix/work around for this?
Thanks in advance,
Jimmy

Hi Jimmy,
I recommend to use “.link-item a” instead as the code below to change the font size of the links:
<style>
.link-item a
font-size:20px !important;
</style>
And I tested the code above in my environment and it worked fine.
Best regards,
Thanks
Victoria Xia
TechNet Community Support

Firefox 9 doesn't handle the css font stack properly

The style body{font:13px/1.231 arial,helvetica,sans-serif;*font-size:small;*font:x-small} should cause the browser to work through the stack and use sans-serif if arial and helvetica are not available. This is how it worked in Firefox 8 and how it works in other browsers.
With Firefox 9 if the first font is unavailable it just substitues one of it's own instead.
If I remove arial and helvetica from the list then FF9 uses the system sans-serif as it should.
I would paste in some sample code, but this forum doesn't seem to support code snippets.

The css in the blogpost http://krakrjak.blogspot.com/2012/01/firefox-901-font-css-bug.html is wrong, and that is why this does not work in Firefox. To access a class you must use the class selector (a dot). For example: .p-inner p { }<br>
You can go to Mozilla Developer Network to learn CSS.<br>
https://developer.mozilla.org/en-US/learn/css<br>

Fonts in Runtime CSS compiled as SWF do not render with setFormatOfRange() but works with setStyle()

Im having a requirement to load fonts at runtime and display them in a RichEditableText, The text in the RichEditableText could have multiple formats so I use the RichEditableText's setFormatOfRange() method to set the font.
I use a CSS compiled as a SWF to load the fonts, Fonts render when the font is set via the -setStyle() method as demonstrated in the code below
Im using Flash Builder 4 with SDK version 4 to compile the app(Using the default Spark Theme).
Below is the CSS file (fontCSS.css)- You might need to copy fonts from the Widows Font folder for this in a fodler named fonts,
/* CSS file fontCSS.css*/
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
@font-face{
    src: url("fonts/Articulate.TTF");
    fontFamily: "Articulate123";
    embedAsCFF: true;
@font-face{
    src: url("fonts/AGENCYB.TTF");
    fontFamily: "Agency123";
    embedAsCFF: true;
Right Click on the CSS file, in Flash Builder 4 and select "Compile CSS to SWF".
Run the MXML application below and you should see the issue Im trying to describe.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="application1_creationCompleteHandler(event)">
    <fx:Script>
        <![CDATA[
            import flash.utils.describeType;
            import flashx.textLayout.formats.TextLayoutFormat;
            import mx.collections.ArrayCollection;
            import mx.events.CalendarLayoutChangeEvent;
            import mx.events.FlexEvent;
            import mx.events.StyleEvent;
            import spark.events.IndexChangeEvent;
            private var swfLoader:Loader
            protected function application1_creationCompleteHandler(event:FlexEvent):void
                var cssEventDispatcher:IEventDispatcher=styleManager.loadStyleDeclarations("fontCSS.swf")
                cssEventDispatcher.addEventListener(StyleEvent.COMPLETE, onComplete);
            private function onComplete(event:Object):void
                fontList.dataProvider=new ArrayCollection(Font.enumerateFonts())
            protected function fontList_changeHandler(event:IndexChangeEvent):void
                var tlformat:TextLayoutFormat=new TextLayoutFormat()
                tlformat.fontFamily=fontList.selectedItem.fontName
                textEditor.setFormatOfRange(tlformat,0,5)
        ]]>
    </fx:Script>
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>
    <s:Label text="Please select a font from the list below"/>
    <s:List id="fontList" change="fontList_changeHandler(event)">
    </s:List>
    <s:RichEditableText id="textEditor2"
                        fontSize="30"
                        fontFamily="{fontList.selectedItem.fontName}"    >
        <s:p>Hello - fontFamily set via css binding</s:p>
    </s:RichEditableText>
    <s:RichEditableText id="textEditor"
                        fontSize="30"
                        >
        <s:p>Hello - fontFamily set via setFormatOfRange()</s:p>
    </s:RichEditableText>
</s:Application>
tried to use an external SWF with the fonts compiled in them Via AS3, that too dosent seem to work, The setStyle() also refuse the work with the below SWF
here is the AS3 project code for your reference
FontEmbedder.as
package
    import flash.display.Sprite;
    import flash.system.Security;
    import flash.text.Font;
    public class FontEmbedder extends Sprite
        public function FontEmbedder()
            Security.allowDomain("*")
        [Embed(source="/fonts/Articulate.TTF", fontName="Articulate123", embedAsCFF="true")]
        public var articulateFont:Class;
        [Embed(source="/fonts/AGENCYB.TTF", fontName="Agency123", embedAsCFF="true")]
        public var agencyFont:Class;
We ve been wrecking our heads off to figure out a solution for this. Ultimately decided to post a question here.
Your feedback will be highly appreciated.
Below are snapshots of how the 2 fonts are rendered
Regards.

Hi Alex,
I did read through your blog the other day, This must have been thepost you were referring to,
http://blogs.adobe.com/aharui/2010/03/flex_and_embedded_fonts.html
The post is explanatory, but how would we implement this successfully wth code?
A working AS3 code example of your explanation would be more than helpful.
Regards

Loading font at runtime for TLF in Flex 3.3

Hey flexers,
I have an app that's using the Flex 3.3 SDK. We pulled the text layout swc from Flex 4 and are using a text flow in our app. Previous to this we had been using the old TextField.
How do I go about loading in a font swf at runtime and getting a text flow to use it? I've tried several things as posted on the forum and around the web and it never actually takes effect in the text flow. Here are a couple questions I came up with along the way though:
When I compile the font swf from the font css, do I need to have embedAsCFF=true?
Should I be able to use StyleManager.loadStyleDeclarations() to load in the font swf? When I do, I get the following error:
VerifyError: Error #1014: Class mx.modules::ModuleBase could not be found.
Any idea why or know how I would load in the font swf?

Let me clarify a bit. Here it says that I need to set embedAsCFF=true to use the font with FTE:
http://help.adobe.com/en_US/flex/using/WS0FA8AEDB-C69F-4f19-ADA5-AA5757217624.html
It's my understanding that in order to use embedAsCFF=true I need to be using the Flex 4 sdk. However, when I convert the CSS to a SWF and attempt to load it into my Flex 3.3 app using StyleManager.loadStyleDeclarations() I get the error:
VerifyError: Error #1014: Class mx.modules::ModuleBase could not be found.
It would appear it's because I'm attempting to load a font "module" that was built in Flex 4 into an app built in Flex 3.3. Is it possible to load a Flex 4 module into a Flex 3.3 app? Is there some other workaround?

Item font CSS

Similar Messages

Maybe you are looking for