<div class=”card-header container-fluid”> <div class=”col-md-10″><h3>Your Header Title</h3></div> <div class=”col-md-2 float-right”>The content you want to add to the right side.</div> </div>
Tag: style
How to use if else block to decide style in Razor
Declare a local variable at the beginning of the View: @{ var yourStyle = “”; if(Model.Condition) { yourStyle = “float:left;”; //specific conditions and logic } else { yourStyle = “float:right;”; //any other conditions and logic } } and then just use it in your div: <div style=”@yourStyle”>
How to align inconsistently sized logos with CSS
These 3 lines will save you (fit, line up, remove background): aspect-ratio: 3/2; object-fit: contain; mix-blend-mode:color-burn; Let’s see how you can use that: In the body section, we have a div with the “photoDiv” class. <div class=”photoDiv”> <img src=”1.png”> <img src=”2.png”> <img src=”3.png”> <img src=”4.png”> <img src=”5.png”> </div> And here is the magical CSS: <style> […]
How to change the style of scrollbar with CSS
::-webkit-scrollbar { width: 12px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; } ::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } You can get more detail from here.
How to apply a custom CSS class to Devexpress components
For all the Devex Components, you can use ControlStyle > CssClass property to apply your custom CSS class (Example 1 and 2) or you can do it with parameter (if it is allowed – as in Example 3). Here is 3 examples for MVC: @Html.DevExpress().SpinEditFor(m => m.Books.Rating, settings => { settings.Properties.SpinButtons.ShowIncrementButtons = true; settings.Properties.Increment = […]