vertical space between labels

I have a few lined up labels like this.

< mx:HBox width = "100%" >
< mx:Label text = "Protein" fontSize = "10" height = "16" / >
< mx:Label text = "{numberFormatter.format (items.currentItem.proteins)}" fontWeight = "bold" height = "16" / > "
< / mx:HBox >
< mx:HBox width = "100%" >
< mx:Label text = "Carbs" fontSize = "10" height = "16" / >
< mx:Label text = "{numberFormatter.format (items.currentItem.carbs)}" fontSize = "10" height = "16" / > "
< / mx:HBox >

But my problem is that the space between the lines is very large
as:

Protein 10

Carbohydrates 20


I want to get the 2 lines more closely to eatch other similar
Protein 10
Carbohydrates 20

How do I do that?
If I do just the label height smaler than 16 the text gets cutt downwards and upwards.

Use somethng that label?

Set the container verticalGap style parent on a lower value or zero (default is 6).

Tags: Flex

Similar Questions

  • Control/reduce the space between labels 2 StackLayout: TopToBottom

    I find that there is a huge vertical space between 2 label in a TopToBottom stack layout.

    Is there a way to reduce or control this space?

    Thank you!

    {Of container
    layout: {StackLayout}
    direction: LayoutOrientation.TopToBottom
    }
    {Label
    Multiline: false
    text: "test Label 1.
    verticalAlignment: VerticalAlignment.Center
    textStyle.fontSize: FontSize.Small
    textStyle.color: Color.DarkCyan
    textStyle {}
    Base: SystemDefaults.TextStyles.TitleText
    fontWeight: FontWeight.Normal
    size: 40
    }
    }
    {Label
    Multiline: true
    text: 'test Label 2 '.
    verticalAlignment: VerticalAlignment.Center
    textStyle {}
    Base: SystemDefaults.TextStyles.TitleText
    fontWeight: FontWeight.Normal
    size: 40
    }
    }
    }

    Put them in a container of DockLayout (one upstairs, one downstairs) and control the height of the container to control the distance between the two labels

  • File PDF of Avery leaves no space between labels

    Using Avery Online Editor, all seems well until Avery print it in pdf format. Solution? See image embeded.

    honeypdf.jpg

    > until Avery print it in pdf format.

    If Avery makes printing to PDF... I think you should contact Avery on their problem

  • white space between the tables

    Hello

    I do an annual report and there is a lot of financial tables. I have 60 paintings and I need to align the tables vertically so that the white space between each table is exactly the same. So far I did it manually. I'm sure there is a better way to do it but I just have not found the way yet. My first thought was to do a 'parent' table with X rows and one column. So I put my child tables in the parent table and use a "row of the spacer" exactly the mm X I tried this but it really complicates things

    Then I tried 'space after' in the properties of the table, but I can't understand what this attribute.

    In other words, I would like that the vertical space between table 1 and table 2 is always exactly 5 mm of the force. How is that possible?

    I would like some inputs/best practices.

    / Best regards

    Thomas Lund

    Your table is placed in a paragraph.  Create a paragraph style that contains that space after that you want between the tables, and then apply that style to all paragraphs that contain tables.  That should give you exactly the spacing between your tables in the flow of the text.

    This will not work unless you are running off the paintings together in a story (which I recommend).

  • Tables InDesign add space between lines of text

    I'm working on a series of documents that use tables for some elements of the text as a calendar with columns for date, day of the week and event. All the cell borders are reset so that the text just looks like tabulated text. The problem that I am running is that the table seems to add about two points of the vertical space between the table and the text above it. Documents are designed without a baseline grid, so I can't simply lock paragraph styles to the grid, but we do not want that the spacing between the different styles of title and other text to be consistent. A table InDesign has some kind of hidden vertical dimension, or am I missing some added space that I should be able to remove? All cells are sized to match the direction of the paragraph style of the text they contain and any space before or after you have added as an insert in the cell, but for some reason any seems to be about two points of extra space at the top of the table (between the table and the text non-table above).

    Sounds like the Table Options > Table Setup > Table spacing.

    Ken

  • Problem with extra space between vertical li in IE7

    I have developed a CSS site in Dreamweaver. The left menu displays correctly without spaces between list items, in Firefox and Safari, but IE7 puts a space between them. I'm not sure if it's the padding or margin or something else. Here is my CSS code.

    @import url("./whitespace-reset.css");
    @charset "UTF-8";
    {body
    background: #c0b7b2 repeat;
    margin: 0;
    padding: 0;
    text-align: center;
    Color: #000000;
    do-family: Verdana, Arial, Helvetica, without serif.
    }
    #container {}
    Width: 761px;
    background: #FFFFFF;
    border: 0;
    text-align: left;
    height: 871px;
    margin: 0 auto;
    }
    #header {}
    height: 148px;
    Width: 761px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    }
    {#leftside}
    Width: 158px;
    float: left;
    margin-top:-41px;
    padding: 0px 0px 0px 0px;
    }
    #leftside ul.menu {}
    padding: 0px 0px 0px 0px;
    make-style: none;
    margin: 0;
    }
    #leftside ul.menu li {}
    display: inline;
    list-style: none;
    padding: 0;
    margin: 0;
    height: 1%;
    }
    #leftside {low}
    bottom: auto;
    }
    {#leftspacer}
    Width: 31px;
    float: left;
    height: 723px;
    margin-top:-41px;
    padding-right: 10px;
    background-image: url(images/home_spacer_left.jpg);
    background-repeat: no-repeat;
    }
    #top {}
    margin-top: 0px;
    height: 38px;
    padding: 0px 0px 0px 0px;
    }
    #top ul.menu {}
    margin-top: 0px;
    margin left: 189px;
    float: left;
    padding: 0px 0px 0px 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    list-style: none;
    }
    #top ul.menu li {}
    display: inline;
    list-style: none;
    float: left;
    margin: 0;
    padding: 0;
    }
    {#bottom}
    height: 22px;
    left: 468px;
    }
    #bottom ul.menu {}
    top of the margin: 300px;
    right margin:-23px;
    float: left;
    left margin:-61px;
    list-style: none;
    }
    #bottom ul.menu li {}
    display: inline;
    list-style: none;
    float: left;
    }
    #mainContent {}
    margin: 10px 5px;
    padding: 0 0 0 0;
    }
    #footer {}
    padding: 0; /
    background: #c0b7b2;
    height: 22px;
    }
    {#threepix}
    margin left: 189px;
    margin-right: 0px;
    height: 114px;
    }
    {#col1}
    position: relative;
    }
    #col1-a {}
    position: absolute;
    Width: 275px;
    right: 0px;
    Top: 0px;
    }
    {#col1-b}
    position: absolute;
    right: 0px;
    Width: 275px;
    Top: 0px;
    }
    {#pixcopyleft}
    margin left: 189px;
    do-size: 1em;
    do-family: Arial, Helvetica, without serif.
    margin-top: 10px;
    }
    {#pixcopyright}
    do-size: 1em;
    margin left: 189px;
    do-family: Arial, Helvetica, without serif.
    margin-top: 10px;
    }
    #footer ul.menu {}
    margin left: 189px;
    margin-right: 0px;
    margin-top:-22px;
    padding: 0px 0px 0px 0px;
    float: left;
    }
    #footer ul.menu li {}
    display: inline;
    list-style: none;
    padding: 0px 0px 0px 0px;
    float: left;
    }
    #footer p {}
    margin: 0;
    Padding: 0 10;
    }
    {img.imageleft}
    float: left;
    left margin: 0px;
    padding: 5px 5px 5px 5px;
    }
    {img. ImageRight}
    float: right;
    padding: 5px 5px 5px 5px;
    text-align: right;
    }
    {.imagecenter}
    text-align: center;
    }
    {.fltrt}
    float: right;
    left margin: 0px;
    padding: 5px 5px 5px 5px;
    }
    {.fltlft}
    right margin: 8px;
    }
    {.clearfloat}
    Clear: both;
    height: 0px;
    font size: 1px;
    line-height: 0px;
    }
    H1 {}
    do-family: Arial, Helvetica, without serif.
    do-size: 1em;
    make-weight: bold;
    margin-bottom: 3px;
    }

    Here is a link to the site http://www.Elixir.biz/core/index.html

    starsavage wrote:

    I have developed a CSS site in Dreamweaver. The left menu displays correctly without spaces between list items, in Firefox and Safari, but IE7 puts a space between them. I'm not sure if it's the padding or margin or something else. Here is my CSS code.

    Add the bottom of your css stylesheet:

    #leftside .menu img {}
    display: block;
    }

  • Remove the default space between buttons

    This seems to be a very simple problem - however, I can't seem to find the solution for it.

    I have a VBox container and a panel with a vertical layout.  Each of them contains several buttons that are about 40 pixels high and stretch to fill the width of the container.  Buttons are displayed vertically, but it seems as if Flex automatically bsigns about 3 pixels of space between each button.  How to remove this space?  It is not a property of 'Margin' associated with the button.

    Here is an example...

    <mx:Panel x="83.5" y="186"
    width="250"
    height="435"
    layout="vertical"
    backgroundColor="#FFFFFF"
    borderColor="#B59D9D">
              
              
              <mx:Button width="100%" height="40" cornerRadius="0" label="Clothing" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana" borderColor="#FCFAFA"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="E-Books" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="Laptops" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="Movies" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="Music" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="Phones" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              <mx:Button width="100%" height="40" cornerRadius="0" label="Software" fontSize="18" color="#363535" fontWeight="normal" fontFamily="Verdana"/>
              
    </mx:Panel>
    

    verticalGap = "0" it should probably work for remove of 3 pixels.

  • Good way to create spaces between fields

    Hello, please am new Blackberry development and I would like to have appropriate spaces between my fields using the horizontal and vertical fields Manager. I've seen suggestions on the use of setMargin() setPadding() or the creation of a field class custom spacer. All of these suggestions will work but don't know there will be consistency when the screen oriented. so I was wondering if there is another way to achieve this spaces that will take into account the orientation of the screen. Advice or links to articles/tutorials will make. Thank you

    Welcome on the support forums.

    http://www.blackberry.com/developers/docs/6.0.0api/net/rim/device/api/ui/Field.html#setPadding(int, int, int, int)
    is the easiest way, it makes the largest field without changing its content.

    http://www.blackberry.com/developers/docs/6.0.0api/net/rim/device/api/ui/Field.html#setMargin(int, int, int, int) is more or less the same, he sets those values for the available to managers without changing the 'size' of the field.

    Finally, you can create a fully customized layout:
    http://supportforums.BlackBerry.com/T5/Java-development/create-a-custom-layout-manager-for-a-screen/...
    It sounds complicated, but once you got it done other much easier layout issues.
    do not mix a provision with a preset manager, extend the class manager directly.

  • Why space between the divs?

    First of all I am more than a copier and paste person then a web site designer.

    I created a page layout, but have a space between the header which contains an image of the logo and a background image.  The logo is in the html code and the background of the header is in the css.  I put the css in the head section, so I wouldn't have to upload a separate .css file.  Also, how would I make the navigation menu appears as soon as the last link or nexus 7 sample is pushed to the bottom of a line?

    Thanks for your suggestions!

    Here is a link to the www.googledrive.com/host/0B39bIUNDgs_JWUF6b0ZONHdLTnc/ page

    And here's the code.

    <! DOCTYPE HTML >

    < HEAD >

    <! DOCTYPE html PUBLIC "" "" > < HTML lang = "en" > < HEAD > < META content = "IE = 11.0000" http-equiv = "X-UA-Compatible" > ".

    < META charset = "utf-8" >

    < META http-equiv = "X-UA-Compatible" content = "IE = edge, chrome = 1" >

    < TITLE > Introduction to design sensible Web < /title >

    < META name = "viewport" content = "width = device-width, original scale = 1" >

    < META name = "GENERATOR" content = "MSHTML 11.00.9600.18212" >

    <!-STYLE CSS START->

    < style >

    {body

    do-family: Helvetica, Arial, without serif.

    padding: 0px auto;

    margin: 0px auto;

    color: #555;

    background: #a6b17a;

    }

    IMG {}

    Max-width: 100%;

    height: auto;

    margin: 0px 0px 0px 0px;

    }

    /* -------------------- HEADER -------------------- */

    {div.} Header

    background-image: url(images/headerbkgnd.jpg);

    background-color:;

    padding: 0px auto;

    height: auto;

    }

    /* -------------------- CONTAINER -------------------- */

    {div. Container}

    Width: 85%;

    height: auto;

    background-color:;

    margin: 0px auto;

    padding: 0px auto;

    -webkit-box-shadow:-1px 10px 0px 3px rgba (0,0,0,0.75);

    -moz-box-shadow:-1px 10px 0px 3px rgba (0,0,0,0.75);

    box-shadow:-1px 10px 0px 3px rgba (0,0,0,0.75);

    }

    /* -------------------- NAVIGATION -------------------- */

    {div. MenuBar}

    Width: 100%;

    height: auto;

    padding: 0px auto;

    margin: 0px auto;

    background-color: #000;

    }

    {UL.topnav}

    list-style-type: none;

    margin: 0;

    padding: 0;

    overflow: hidden;

    background-color: #333;

    }

    UL.topnav li {}

    float: left ;}

    UL.topnav li a {}

    display: inline-block;

    color: #f2f2f2;

    text-align: center;

    padding: 10px, 12px;

    text-decoration: none;

    transition: 0.3 sec.

    do-size: 12px;

    do-family: Arial, Helvetica, without serif.

    }

    ul.topnav Li a: hover {}

    background-color: #111;

    color: Red;

    }

    UL.topnav li.icon {display: none ;}}

    /* -------------------- BODY CONTENT -------------------- */

    {div. Body-content

    min-height: 515px;

    padding: 0px auto;

    background-color: #FFF;

    }

    /* -------------------- FOOTER -------------------- */

    div.footer {}

    background-color: #000;

    color: #FFF;

    padding: 0px 0;

    text-align: center;

    height: 75px;

    do-size: 12px;

    make-weight: bold;

    }

    / * - RESPONSIVE CSS-* /.

    @media screen and (max-width: 680px) {}

    UL.topnav li: not(:first-child) {display: none ;}}

    UL.topnav li.icon {}

    float: right;

    display: inline-block;

    }

    }

    @media screen and (max-width: 680px) {}

    {UL.topnav.Responsive}

    position: relative;

    }

    UL.topnav.Responsive li.icon {}

    position: absolute;

    right: 0;

    top: 0;

    }

    UL.topnav.Responsive li {}

    float: none;

    display: inline;

    }

    UL.topnav.Responsive li a {}

    display: block;

    text-align: left;

    }

    }

    < / style >

    <! - END CSS STYLE - >

    < / head >

    < body >

    < div class = "container" > <!-CONTAINER START->

    <! - check out header - >

    < div class = "header" >

    < img src = "images/lt350.jpg" alt = "Logo" > "

    < / div >

    <!--end Header-->

    <! - START MENUBAR & NAVIGATION - >

    < div class = "menu bar" >

    UL class = "Visibility" >

    < li > < a class = "active" href = "#home" > home < /a > < /li >

    < li > < a href = "#" > Sample Link 1 < /a > < /li >

    < li > < a href = "#" > Sample Link 2 < /a > < /li >

    < li > < a href = "#" > Sample Link 3 < /a > < /li >

    < li > < a href = "#" > Sample Link 4 < /a > < /li >

    < li > < a href = "#" > Sample Link 5 < /a > < /li >

    < li > < a href = "#" > example link 6 < /a > < /li >

    < li > < a href = "#" > example link 7 < /a > < /li >

    < class li = "icon" > < a href = "javascript:void (0);" "style =" do-size: 15px; " "onclick ="myFunction ()"> & #9776; < /a > < /li >

    < /ul >

    < / div >

    <!--END MENUBAR & NAVIGATION - >

    <!--> CONTENT in the BODY of the BEGINNING

    < div class = "body-content" > < / div >

    <!--> CONTENT BODY END

    <!--> START PAGE foot

    < div class = "footer" > < / div >

    <! - END footer - >

    < / div > <! - END CONTAINER - >

    <!--> STARTUP SCRIPT REACTIVE

    < script >

    Function myFunction() {}

    document.getElementsByClassName ("topnav") [0].classList.toggle ("responsive");

    }

    < /script >

    <! - END SCRIPT REAGENT - >

    < / body >

    < / html >

    Remove the space under the logo image - add your css stylesheet below

    . Header img {}

    vertical-align: bottom;

    }

    How to evoke the Burger menu earlier - change the value of px 900px in both your support queries:

    @media screen and (max-width: 900px)}

  • Mobile menu - too much space between items

    I tried to make mobile menus with several widgets Muse-theme, but all have large vertical spacing between the menu items. See screenshot. Don't know if it's muse or the widget, but it seemed to work the first time. Is there a setting I'm missing?

    menu.jpg

    I would check the "spacing" affecting something is certainly the addition of this extra space

  • How to add a space between the two tabs in accodion widget?

    Hello! I use the accordion widgets and try to add space between each of the tabs, would someone help me with that. Thank you

    Directly edit the output of Muse is virtually always a bad idea. At the very least, it will create a very heavy workflow because the Muse will overwrite your changes each time you re-export (export, download, publish, preview).

    It depends exactly what visual effect you want to achieve, but you probably need to just select the Accordion widget and use the spacing Panel to adjust the value of vertical gutter.

  • Need to remove the space between &lt; af:panelGrouplayout &gt; and &lt; af:panelBox &gt;

    Hi all

    I use JDeveloper 11.1.1.6.

    My scenario is I need to stretch some fields for all browsers, so I use Panel box inside the < f: facet center = name > panelStretchLayout.

    It works very well. But some scenarios need to display the header above the group box elements. Then I try to add panelGroupLayout in < f: facet = top name >. It is stretching very well, but is always to show space between < af:panelBox >.

    How can I remove the space between < af:panelGroupLayout > and < af:panelBox >?

    My Codes like this,

    < af:panelStretchLayout id = "PSL1" inlineStyle = "" margin-top: 30px; ">"

    < f: facet = 'top' name >

    < af:panelGroupLayout id = "pgl4" layout = "vertical".

    inlineStyle = "" background-color: red; ">"

    < af:panelGroupLayout layout = "horizontal" id = "pgl1" >

    < af:outputText value = 'Day' id = "ot1" / >

    < af:outputText value = "Week" id = "ot2" / >

    < af:outputText value = 'Months' id = "ot3" / >

    < af:outputText value = 'Year' id = "ot4" / >

    < / af:panelGroupLayout >

    < / af:panelGroupLayout >

    < / f: facet >

    < f: facet name = "center" >

    < columns af:panelDashboard = rowHeight '1' = "100%" id = "pd1" >

    < af:panelBox id = "pb1" showDisclosure = "false".

    showHeader = "never" > < / af:panelBox >

    < / af:panelDashboard >

    < / f: facet >

    < / af:panelStretchLayout >


    Thank you...

    Same answer as your other thread need to hide the space between &

    Use firebug to see if a style is the cause because it is not reproduced.

    Timo

  • Unformattable Indesign text - how to remove the spaces between paragraphs?

    I have a 95 page indesign document. I have a few unwanted spaces between paragraphs. I could not get rid of these spaces. I tried to replace the formatting, using the window styles to paragraph, but in this case indesign does not yet recognize the formatting. I put paragraphs in form to 0P0 before and after paragraphs, and yet space remains between some paragraphs. I'm going crazy!

    The problem lies in the text imported into strange formatt, but that was five years ago and I don't even have access to the original text to try to import once more. Perhaps because it is a document to Indesign c5 and c6 now I use?

    Any help appreciated with gratitude,

    Sam

    After checking the object applied to blocks of text style: text frame JWK it shows under text frame General Options/Vertical Justification/Align/Justify (Peter Spier mentioned above about this possibility). I would put this Align/Top. Also when you changed the paragraph to align on the grid he left some gaps on some pages. I have put that back in would line up on the starting grid. There will be a reshuffle of the text when you do. To check if everything looks as it should. Make a copy of the file and make your changes there just in case, and let us know how it goes.

  • Want to only two elements of the page without a space between them.

    I give a broader and more generic framework to an earlier application seeking a broader response.

    I want two elements on the page without horizontal between space. (Don't ask why!) One is a contant, say ' * ' so I made a single display element. The other is the label of a numeric field that is referenced in the error messages generated by the ARF.

    Call the label LABEL to make this easy. So, I want to see {noformat} * {noformat} LABEL. I don't want to change the label of "* LABEL" because ARF refers to "* LABEL" in error messages. I want to just fix the two elements on the form. This must be something easily done in the APEX, right?

    (For the initial application, see asterisk desire by a label point of page without space between. .)

    Thank you and God bless you,
    Howard

    Hello

    Just change your article networking sessions (if you use apex 4.2)

    Start the new grid: No.
    Start the new row: No.
    New section: No.

    FYI, you may need to use

    & nbsp

    in your point label to get a space

    If you use apex 4.1, I remember: new field should be no.

    Best of luck,

    Best regards
    Fateh
    -------------------
    If you think that my answer was correct or helpful to you, then please check the response as helpful or appropriate.

  • How to put spaces between a stack of icons social media?

    On the next page of test

    http://www.shyamasundaradasa.com/Jyotish/temp/Untitled-1-Delete.html

    you will see on the right side are 7 icons to different social media. If they were horizontal, then there would be a small space between them, but not so much when vertical. This becomes a problem on a smart phone because they are small and touch.

    I tried to put "/p > < p > < ' (for some reason any text I put between the < p > < / p > does not appear ) between them but there was too much space. However, I have to make a div container, then a div with padding for each, but it seemed awkward and I thought there must be another way.

    Will there be an elegant solution to put a space between them?

    Branko VL

    Post edited by: Branko VL

    Try this:

    #recommend span {}

    padding-bottom: 5px;

    }

    This target span tags in #recommend div and add only padding-bottom, thereby offsetting each 5px span element.

Maybe you are looking for