Height CSS question

I have a 90% CSS height in my div container that doesn't seem to work.  Width seems to work very well, but the appeal of height off does not respond.  I'm just getting started on this subject, and I don't know what I'm missing.  Another set of eyes would be useful.

Thanks in advance

http://gtworkspace.com/css_height/

Add to your css styles and see what happens:

{html, body
height: 100%;
}

Tags: Dreamweaver

Similar Questions

  • CSS Question %, EM, px dimensions

    How the browser does not render css when a css property has a value, but the value is not a unit of measurement. IE %. PX, em is not specified.

    Amy:

    I think the deal is that when the style in question has an associated default digital value (height of the default 1 line), you can use a number of multiplier, for example, line-height: 2, with success.

  • Simple (!) CSS question

    Trying to transition to the use of CSS for layout. Ran into a question, can't understand why.


    Here is the CSS of the page I'm working on that:

    @charset "UTF-8";
/* CSS Document */

#container {
     width: 968px;
     margin: 0 auto;
     padding-left: 10px;
     padding-right: 10px;
     overflow: hidden;
     border: 2px solid #FF0000;
}
#main_image {
     background-image: url(../images/main.jpg);
     background-repeat: no-repeat;
     position: relative;
     height: 376px;
     width: 968px;
}
#left_column, #center_column, #right_column {
     width:316px;
     float:left;
}
#center_column, #right_column {
  margin-left: 10px;
}

    The problem occurs when I add the float: left; rule, highlighted above. In Dreamweaver, he seems to be pushing 3 columns to the bottom and outside of the container div - I added the Red 2px border to the container to confirm.

    However, viewing the page in a browser, it appears that 3 columns are correctly nested in the container div.

    It is disconcerting, because this isn't WYSIWYG!

    Someone suggested to turn off all Visual AIDS. Did not help.

    Can anyone suggest what is happening here? It would be GREATLY appreciated.

    Here is the page: http://www.stephencoren.com/CSS_Tutorial/NavBar.htm
    Here's the CSS: http://www.stephencoren.com/CSS_Tutorial/css/NavBar.css

    Here is a screenshot of what I see in DW CS3 in Safari: http://www.stephencoren.com/CSS_Tutorial/example.jpg

    Thank you.

    DWCS3 is also unable to make CSS layouts as was DWCS4 and DWCS4 was not as good as DWCS5.  When I look at your page layout in Design CS5 mode, I see exactly the same thing I do in the browser.  But as bemdesign, DW Design view is not now and has never been good enough for anything other than a rough layout.  The browser (or Live see DW) is the only way to be relatively safe.

  • HTML + CSS question

    Hello

    I don't know if my question may be answered here, but here's what happens:

    I have a blog on my page hosted by Zenfolio, and they do not support this, but its their interface do this and not me. Whenever I have insert a new picture and click on next to him and then "enter" to make a new paragraph below for text or another picture she added paragraphs unwanted! In the photo below, it should be a paragraph and not 8.

    I used to have this happen to me in Dreamweaver rarely, but I was able to go to HTML view and just delete the additional paragraphs without changing the rest of the provision. If I will not remove just these paragraphs in HTML mode in this interface, it would mangle everything... See the other screen capture: it moves the text around the image which is not what I want.

    html.css paragraph issue.jpg

    Region capture 9.png

    This interface, I'm typing now is very similar to that of Zenfolio, here too I have inserted these pictures and had to click beside them + enter to go to the next paragraph, and when I looked at the HTML code it there was a paragraph spacing between the images as it should; so the question is why she did this and How can I make sure that she! I rather not use tables. (Who was their suggestion, and who also has a problem of spacing; I set the cell height to 22 for example and when the preview of the post its at least 60).

    @agp 1000: the screenshot, I see that there is a float: left applied on the image.

    This will cause the next item, which is the text to start immediately to the left of the image.

    So as a simple solution, you can add clear: left on the

    tags, so that the text will start from the next line and not move the image as in the screenshot.

    Do not post all the code if this does not help you.

  • Interactive report CSS question...

    Hi all..

    APEX: 4.1
    BROWSER: IE 7
    Database: 11g

    Please help me with this CSS problem.
    I have an interactive report that is too large for the region.
    I use the following CSS to have a bar scrolling for this region,
    If it grows more.
    Region Header:
<div style="overflow:auto;overflow-y: hidden;">

Region Footer:
</div>
    Please see the following page.

    http://Apex.Oracle.com/pls/Apex/f?p=41803:4
    workspace: kumar2003
    Username:test_user
    password: test
    application: 41803
    Page: 4




    I have the following problems with the report.

    (1) If you scroll the report, "" OBSERVE THE "' GO AND ' ' BUTTONS of ACTION '" interactive reports.
    Even the button are also mobile and spoil the appearance of interactive report.
    Is anyway to keep the buttons in the same situation?

    Another question:

    (2) instead of a scroll at the bottom of the area bar, it is possible to
    '' increase the width of the region' "until the report develops?
    What CSS changes in the level of the region as I do?

    Please help me

    Hello

    I don't know what the problem is.
    But if fix you this move button, I guess you have problem that drop downs column header are not aligned correctly when you click the header.

    Maybe you check this plugin
    http://www.apex-plugin.com/Oracle-Apex-plugins/dynamic-action-plugin/IR-plugin-package_108.html

    Kind regards
    Jari

    http://dbswh.webhop.NET/dbswh/f?p=blog:Home:0

  • CSS - question text style

    Can anyone identify what kind of text style is?  If you look at the header or the net asset value, it seems that the text is cut off.  I found the text shadow in the style sheet, but I do not think that it what it does.

    Any help would be appreciated.

    http://crushlovely.com/

    Does that answer your question?

    text-decoration: none;

    Color: #000000;

    text-shadow: 1px 0pt 0pt rgba (255, 255, 255, 0.7);

    text-transform: uppercase;

    do-family: Helvetica, Arial, without serif.

    make-style: normal;

    do-variant: normal;

    make-weight: bold;

    font size: 0.785em;

    line-height: normal;

    do-size-adjust: none;

    do stretch: normal;

    -x-police-system: none;

    Outline-width: medium;

    outline-style: none;

    the outline color:-moz-use-text-color;

  • Integration HTML/CSS question

    Hi all, I have created a Facebook of HTML/CSS custom box. Look perfect in all the major browsers... set apart... you guessed it... Internet Explorer. I have tried everything I can, but it does not move. Ideas, any help would be greatly appreciated.

    <link rel="stylesheet" href="http://www.chichairandbeauty.co.uk/css/facebook.css" type="text/css" media="screen" />
<div class="outer">
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/like_us.gif" class="img"></div>
<div class="navContain">
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/facebook_03.gif" class="img"></div>
<div class="container"><a href="http://www.chichairandbeauty.co.uk/hairdressing-prices.php"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/facebook_04.gif" class="img"></a></div>
<div class="container"><a href="http://www.chichairandbeauty.co.uk/beauty-prices.php"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/facebook_05.gif" class="img"></a></div>
<div class="container"><a href="http://www.chichairandbeauty.co.uk/newton-abbot-packages.php"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/facebook_06.gif" class="img"></a></div>
<div class="container"><a href="http://www.chichairandbeauty.co.uk/childrens-hair-parties.php"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px; MARGIN-LEFT: 0px;" src="http://www.chichairandbeauty.co.uk/images/facebook/facebook_07.gif" class="img"></a></div>
</div>
<div class="mainBacking">
<div class="intro">Chic of Newton Abbot is just a step away from the high-street, indulge yourself in a hair, beauty or skin therapy treatment with one of our highly trained professional hairdressers or beauty technicians. We offer a wide range of luxury hair, beauty and skin care treatments for you to choose from, and delightful packages to suit all.</div>
<div class="columnOne">
<div class="salonInformation">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/salon_info_header.png" width="234" height="30"></div>
<div class="salonInfoBacking">
     <div class="insideTab"><strong>OPENING HOURS</strong><br/>We’re open Tuesday - Saturday, <br><strong>9am - 5pm.</strong><br/></br><strong>TELEPHONE</strong><br/>01626 362600<br/><strong>EMAIL</strong><br/>[email protected]<br/><strong>ADDRESS</strong><br/>9 Market Hall, Opposite Somerfield<br/>Newton Abbot,<br/>Devon,<br/>TQ12 2RX</div>
     </div>
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/salon_info_footer.png" width="234" height="7"></div>
     </div>
     <!-- Beginning of hairdressing prices -->
<div style="margin-top: 15px;" class="genericTab">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/hairdressing_header.png" width="234" height="30"></div>
<div class="genericBacking">
     <div class="insideTab"><div class="work">
       Dry Trim <br/>
       Wet Cut and Blast<br />
      Restyle<br />
      Restyle and Blowdry<br />
      Cut and Blowdry<br />
      Blowdry<br />
      Shampoo and Set<br />
      Trim, Shampoo and Set<br />
      Luxury Conditiong Treatment<br />
      Fringe Trim<br />
      GHD Curling<br />
      Special Occasion or Prom Hair<br/><br/>Visit our website for full price lists.<br/><a href="http://www.chichairandbeauty.co.uk/hairdressing-prices.php">Click here to visit website.</a>
      </div>
      <div class="prices">
      £15.00<br />
      £21.00<br />
      £19.00<br />
      £30.00<br />
      £25.00<br />
      £15.00<br />
      £13.00<br />
      £18.00<br />
      £9.00<br />
      £5.00<br />
      £11.00<br />
      £31.00
      </div>
      </div>
     </div></div>
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/generic_footer.png" width="234" height="7"></div>
<!-- End of hairdressing prices -->
     </div>
<div class="columnTwo">
<div class="genericTab">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/special_offers_header.png" width="234" height="30"></div>
<div class="genericBacking">
     <div class="insideTab">
     <div class="specialOfferContainer">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/special_offer_01.png" width="50" height="50"></div>
     <div class="specialOfferExplain"><strong>BACK TO SCHOOL</strong><br/>Recieve a 50% discount on kids hair for the Back to School season. Visit website for more information.</div>
     <div style="margin-top: 15px;" class="specialOfferContainer">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/special_offer_02.png" width="50" height="50"></div>
     <div class="specialOfferExplain"><strong>HALF PRICE MANICURES</strong><br/>1/2 Mini Manicure or Pedicure offer all throughout August. Visit website for more information.</div>
     <div style="margin-top: 15px;" class="specialOfferContainer">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/special_offer_03.png" width="50" height="50"></div>
     <div class="specialOfferExplain"><strong>10% STUDENT DISCOUNT</strong><br/>Students can enjoy a 10% discount on all hair, beauty or skin therapy treatments. A valid NUS card is required on arrival to the salon.</div></div></div>
     </div>
     </div>
     </div>
     </div>
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/generic_footer.png" width="234" height="7"></div>
<!-- Beginning of beauty prices -->
<div style="margin-top: 20px;" class="genericTab">
     <div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/beauty_header.png" width="234" height="30"></div>
<div class="genericBacking">
     <div class="insideTab"><div class="work">
     Eye Brow Waxing<br/>
     Top Lip & Chin Wax<br/>
     Brow Tint<br/>
     Lash and Brow Tint<br/>
     Foot & Leg Massage<br/>
     Dermalogica Treatments (from)<br/>
     Mini Manicure
    <br/><br/>Visit our website for full price lists.<br/><a href="http://www.chichairandbeauty.co.uk/beauty-prices.php">Click here to visit website.</a>
      </div>
      <div class="prices">
      £8.00<br />
      £16.00<br/>
      £8.00<br />
      £16.00<br/>
      £20.00<br/>
      £20.00<br/>
      £13.00<br/>
      </div>
      </div>
     </div></div>
<div class="container"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/generic_footer.png" width="234" height="7"></div>
<!-- End of beauty prices -->
     </div>
     </div>
     <!-- Start of footer -->
     <div class="container"><a href="http://www.chichairandbeauty.co.uk"><img style="MARGIN-TOP: 0px; FLOAT: left; MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px" src="http://www.chichairandbeauty.co.uk/images/facebook/view_website.jpg" width="520" height="33"></a></div></div>
     <!-- End of footer -->


      
    Call today or pop in to discuss your requirments with one of our dedicated team of technicians who will be happy to help.

    This line of code will give you jip!  It seems that you missed the > on the opening

    tag.

    I guess that's the page you think: chichairandbeauty.co.uk/hairdressing-prices.php?

    If I were you I use the validator and whisk through some of the issues are described.

    Martin

  • A simple CSS question

    I don't know how I managed, but the list appears on the right side of the div, despite the fact that I have text-align: left.

    A reflection about how I managed?

    HTML:

    < div id = "workArea" >
    < div id = "nav" >
    < ul >
    < li > < a href = "#product1" > product 1 < /a > < /li >
    < li > < a href = "#product2" > product 2 < /a > < /li >
    < li > < a href = "#product3" > product 3 < /a > < /li >
    < li > < a href = "#product4" > product 4 < /a > < /li >
    < /ul >
    < / div >
    CSS:

    #nav {}
    top: 95px;
    position: absolute;
    Width: 150px;
    left: 0px;
    height: 411px;
    text-align: left;
    background-color: #CCCCCC;
    }

    Li {list-style: none ;}}
    a {text-decoration: none; color: #000000; outline: none ;}}

    http://gtworkspace.com/peloton/product_pg

    Absolute positioning, yuck!  You just need your lists of style better.

    Try this (note the changes in red):

    #nav ul {}

    margin: 150px 0;
    padding: 5px;
    Width: 145px;
    float: left;
    background-color: #CCC;
    do-size: 16px;

    }

    #nav li {list-style: none}

    #nav li a {}

    Display: block;

    Color: #000;

    text-decoration: none;

    }

    #nav li a: hover,

    #nav li a: active,

    #nav li a: focus {}

    color: #FFF;

    text-decoration: underline;

    }

    Nancy O.
    ALT-Web Design & Publishing
    Web | Graphics | Print | Media specialists
    http://ALT-Web.com/
    http://Twitter.com/ALTWEB
    http://ALT-Web.blogspot.com

  • CS3 Spry css question

    I know basic css without table, my question is, instead of a navigation bar regular, I need to use the widget, spry for a navigation bar drop down menu on an exisitng html page. I am able to insert the spry to the appropriate place on the .html page and make it work but I have a CSS file that is already attached to the page that I need to know if I can just select all of the css in the css spry page and insert it inside my page associated css?

    Any help?

    Yes - you can copy the CSS into your own plug and then remove the reference to the default stylesheet Spry. Alternatively, make a copy of the spry roadmap to edit and link to this one separately.

  • Positioning CSS questions

    I'm in the beginnings of the creation of my first 'real' site. (In other words, my first site that can actually do something) And I put all my skills to the test. I'm begin by nailing to the bottom of my page/design layout, so I'll switch to programming. I have some problems with positioning/formatting CSS in Internet Explorer.

    Here's the url: http://lwrussell.com/new_site/

    So far, I've been able to determine all questions that raised between these two browsers except these two problems:

    In Internet Explorer, you will notice that the right hand navigation seems cut upward while it looks perfect in Firefox. Any ideas on this one?
    Also, the content area of the body/is placed to the right 10 + pixels in IE where it is in FF.

    Any help?

    Thank you guys! I really appreciate it!
    Luke

    The page looks the same in IE7/FF2x.

    > IE and FF deal differently with some padding and margins

    No, they don't. At least not in the standard mode. What IE 6 does, however,
    of doubling the margin on a floating when the float element and the margin
    are on the same side. Difficulty on this page by adding-

    Display: inline;

    the rule of #content.

    Why are you using the

    Tag?

    In any case, if you remove your items #ntred and #nbred, you will see the
    Navigation-don't know what they're doing, or why they are there.

    --
    Murray - ICQ 71997575
    Adobe Community Expert
    (If you * MUST * write me, don't don't LAUGH when you do!)
    ==================
    http://www.projectseven.com/go - DW FAQs, tutorials & resources
    http://www.dwfaq.com - DW FAQs, tutorials & resources
    ==================

    "grammarg" wrote in message
    News:ffbsda$E8R$1@forums. Macromedia.com...
    > IE and FF deal differently with some padding and margins. Maybe start by
    > Reset the default settings? Try this link and you can Google for similar
    > things
    > if this seems to fix the problem.
    >
    > http://www.clagnut.com/blog/1287/
    >

  • IE 6.0 CSS questions

    Hello
    I am relatively new to web design and have set up a personal site that I can play and learn about:
    http://Kinross.100webspace.NET/

    The problem is how my pictures appear on my index page. I use the rules following for CSS bring to float right:
    {.imgright}
    float: right;
    height: auto;
    Width: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 5px;
    }

    Displays well in Firefox, however the photos look "crushed" in IE. I don't see anything wrong with the CSS myself but thougth it could be one of the (many) bugs IE. Can someone help me please to get the photos to display properly in Internet Explorer.

    P.S. not until you start to design for the web don't you understand just which piece of _ _ _ _ IE is! She always so far every time I had a problem of layout between FF and IE because IE does not appear according to the standards. BTW is IE 7 adhear to the web standards better now?

    Try to get rid of height: auto; and width: auto; Theres nothing else in
    This css that can possibly be attributed to distorted images.

    Brett Kinross wrote:
    > Hi
    > I am relatively new to web design and have set up a personal site I can
    > play and learn about:
    > http://kinross.100webspace.net/
    >
    > The problem is how my pictures appear on my index page. I use the
    > following CSS rules to float right:
    > .imgright {}
    > float: right;
    > height: auto;
    > width: auto;
    > padding-top: 0px;
    > padding-right: 0px;
    > padding-bottom: 0px;
    > padding-left: 5px;
    > }
    >

  • ListClass using height CustomCellRenderer question

    I am trying to create a list of items using qnx.ui.listClasses.List. I have a customCelleRenderer that extends the CellRenderer class. I have a background image with the height of 110 pixels. Currently I have 4 items in the list. When I run my application, all four items appear but when I trace the CustomCellRenderer height, it shows that 47 pixels.

    What is the minimum height of the CellRenderer class? How can I do to make my every cell size is 110 pixels?

    I'm new to qnx components. Help, please. Thank you.

    key kminkeller,

    Lists and cell renderers are difficult to crack, but we were trying to understand. From the looks of us must apply the height of the list via the List.rowHeight property object in the main class (or who ever has class introduce you the List object). by doing this you would change the heights of all the cells. the draw however back is waterver height you set it to will live up to all the cells. but since it will not be a problem for you it works.

    Here is more information about the property:

    http://www.BlackBerry.com/developers/docs/airapi/1.0.0/QNX/UI/listclasses/list.html#RowHeight

    hope that helps. Good luck!

  • Several CSS questions

    OK, so now I'm having a problem with the size of my Web page.  I have a container the value width: 90%, but one of the pages use a separate css page called bootstrap.css.  It is because I have included a Bootstrap carousel with a feature in Dreamweaver.  Does anyone have advice on how I can make this page the same size as the rest of them?  Here is a link to my Web site: home

    I don't see Glyphicons mentioned anywhere in your code.  This is perhaps why they are not appear?

    My awesome site

    Some pithy slogan...

  • CSS questions

    Hey-

    So many times when I'm playing with the CSS code, I'll make an adjustment to something like change the margins to place it where I want, but when I click on the screen other elements involuntarily to his place.  Can someone help me understand why this is happening? !

    Review the CSS box model.

    CSS box model

    Box = the content width + left & border + left & right padding to the right + left & right margins.

    If you add left or right margins, often you need to compensate by cutting something else on your boxes.

    Nancy O.

  • Onhover CSS question

    Hello

    I have a simple fxml:

    <?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>

<AnchorPane maxHeight="54.0" minWidth="1004.0" prefHeight="54.0" styleClass="header-app" stylesheets="@../file.css" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
<children><HBox alignment="CENTER_LEFT" layoutX="758.0" layoutY="-10.0" prefHeight="54.0" spacing="5.0" styleClass="user-profile" AnchorPane.bottomAnchor="0.0" AnchorPane.rightAnchor="15.0" AnchorPane.topAnchor="0.0">
<children><ImageView fitHeight="34.0" fitWidth="34.0" pickOnBounds="true" preserveRatio="true">
<image>
<Image url="@../images/icons/user.png" />
</image></ImageView><Label styleClass="label-utente" text="Horian Simon" />
</children></HBox>
</children></AnchorPane>

    Fxml opens as in the picture. I want that when I move the mouse on the user profile HBox label 'label-user' modify the fillcolor text to white.

    http://snag.Gy/KM0ER.jpg

    This is the css:

    .header-app{    
    -fx-background-color: #3A4049;    
}

.user-profile{
    -fx-padding: 0 15 0 15;
    -fx-cursor: hand;    
}

.user-profile:hover{    
     -fx-background-color:  #2d2d2d;
     -fx-text-fill: #ffffff !important;
}

.user-profile .label-utente{
    -fx-text-fill: #9C9C9C;
    -fx-font-weight: 400; 
    -fx-font-size: 14px;
    -fx-padding: 0 5 0 5;    
}

    There is a smart way to do only with fxml + css?

    Thank you very much

    . User profile: hover when .label {-fx-fill: white ;}}

Maybe you are looking for