css - Don't hide items when there are still space -


i trying use command bar of ng-office-ui-fabric, here code

<!doctype html> <html> <head>   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>   <link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/2.6.3/css/fabric.min.css" />   <link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/2.6.3/css/fabric.components.min.css" />   <script src="https://cdnjs.cloudflare.com/ajax/libs/ngofficeuifabric/0.15.3/ngofficeuifabric.min.js"></script> </head> <body ng-app="yourapp">    <div ng-controller="yourcontroller">       <uif-command-bar>         <uif-command-bar-main>           <uif-command-bar-item>             <span>one</span>           </uif-command-bar-item>           <uif-command-bar-item>             <span>two</span>           </uif-command-bar-item>           <uif-command-bar-item>             <span>three</span>           </uif-command-bar-item>         </uif-command-bar-main>       </uif-command-bar>   </div>   <script type="text/javascript">      angular.module('yourapp', ['officeuifabric.core', 'officeuifabric.components'])     .controller('yourcontroller', ['$scope', function ($scope) {}])   </script>  </body> </html>

if change width of preview, see items hidden (we see class is-hidden added), though there visually lots of space.

does know how control limit width such items not hidden easily?

another option never hiding command items, know how enable this?

otherwise, possible make command bar office-ui-fabric in angularjs without ng-office-ui-fabric?


Comments

Post a Comment

Popular posts from this blog

html - How to set bootstrap input responsive width? -

Image
i need inline form calendar in both fields. reason can't rid of space between text , borders of input... here picture of problem i've tried set width parent div , input itself.... no good.. here i've done far. fiddle : <div class="modify_search"> <div class="search_wrapper"> <div class="search_header"> <form class="form-inline"> <div class="left"> <span>du</span> <div class="input-group"> <input type="text" class="form-control search_input" id="inlineforminputgroup"> <div class="input-group-addon"> <i class="fa fa-calendar" aria-hidden="true"></i> </div> </div> </div>
Read more

javascript - Highchart x and y axes data from json -

here js fiddle : demo i plotting differences of timestamps in multiple series reading data json. how plot "timestamp","timestamp2","timestamp3" against "tempersensordata" instead of steps? var processed_json = new array(); //ts1 var processed_json1 = new array(); //ts2 // populate initial series (i = 0; < data.length; i++){ processed_json.push(data[i].timestamp/1000); processed_json1.push(data[i].timestamp2/1000); }
Read more

javascript - Get js console.log as python variable in QWebView pyqt -

Image
i'm trying build application creates html + js code python , loads qwebview. the final html + js code following (raw code available here ): <head><meta charset="utf-8" /><script src="https://cdn.plot.ly/plotly-latest.min.js"></script></head><div id="mydiv" style="height: 100%; width: 100%;" class="plotly-graph-div"></div><script type="text/javascript">window.plotlyenv=window.plotlyenv || {};window.plotlyenv.base_url="https://plot.ly";plotly.newplot("mydiv", [{"type": "scatter", "x": [6.81, 6.78, 6.49, 6.72, 6.88, 7.68, 7.69, 7.38, 6.76, 6.84, 6.91, 6.74, 6.77, 6.73, 6.68, 6.94, 6.72], "y": [1046.67, 1315.0, 1418.0, 997.33, 2972.3, 9700.0, 6726.0, 6002.5, 2096.0, 2470.0, 867.0, 2201.7, 1685.6, 2416.7, 1618.3, 2410.0, 2962.0], "mode": "markers", "ids": [0, 1, 2, 3, 4, 5, 6, 7, 8,
Read more