How to get the max width of my css element using javascript


Tags: javascript,jquery,css

Problem :

I'm trying to get the max width of my CSS element by using javascript. I'm currently able to get the width but not max-width.

hsWidth = $("#horizontal-scroll").width();

Thanks



Solution :

Use jQuery method .css() :

var max_width = $("#horizontal-scroll").css('max-width');

Hope this helps.

var max_width = $("#horizontal-scroll").css('max-width');

console.log(max_width);
#horizontal-scroll{
  max-width: 250px; 
  display: block;
  background-color: green;
  width: 200px;
  height: 50px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="horizontal-scroll"></div>


    CSS Howto..

    How to force a div to scale at 100% width of the current windows Browser

    How to apply multiple transforms in CSS?

    CSS - How make the page scroll over the edge of the window

    How can I instantly stop a CSS animation on hover?

    How to use custom underline with breakline in CSS?

    How to center a navigation bar properly? [closed]

    Maintain border-spacing when using show() on a display:table element hidden with display:none

    How to load only html from web pages in selenium

    How to create a circle and a bar that overlap with css?

    How to add style to the parent when radio button is selected

    Image div showing in Safari, Chrome and IE but not in Firefox

    How to prevent page jump when using # href to swap gallery images using a div ID?

    How to have constants in Flex CSS files

    How can the top DIV from two stacking DIVs affect the other's height

    How to center two square blocks in page?

    How to style a table from horizontal layout to vertical layout with CSS

    How to get Circle Hover Effects with CSS Transitions with img tag?

    How to remove an elements active state when a sub element is clicked

    How to apply css animation to angular view when the view is called

    How to set background color based on YAML front matter (Jekyll)

    How do you tell which css class to modify?[Example inside]

    How can I use a non-breaking space before an inline-block-default element, such as a

    How to get at Apache Wicket PropertyColumn data to dynamically change CSS class based on content?

    Materialize CSS Showing errors on form fields

    How do I achieve this animation using javascript/jquery? [closed]

    how can I set my gradient background in css for full width and height of the page?

    How to edit the element.style css?

    How to filter elements on click in js?

    overlaping text with different styles over image, prevent text of one style to be shown on top of the text of another style

    How do I target a first-child that is visible (after children that are set to display:none), with only CSS