Div Size Automatically size of content

Question

I am trying to make a h2 header for sidebar widgets but I want the width of the div class to be whatever width the content becomes  It seems I can t just set a width because those headlines with longer content then shorter content makes it break   How can I simply make width stretch change depending on the length of content there is  Any help would be greatly appreciated

User · Accepted Answer

As far as I know  display  inline-block is what you probably need  That will make it seem like it s sort of inline but still allow you to use things like margins and such

User · Answer

The best way to do this is to set display  inline   Note  however  that in inline display  you lose access to some layout properties  such as manual height and vertical margins  but this doesn t appear to be a problem for your page

User · Answer

The easiest is  width  fit-content

User · Answer

If display  inline  isn t working  try out display  inline-block

User · Answer

If you are coming here  there is high chance width  min-content or width  max-content can fix your problem  This can force an element to use the smallest or largest space the browser could choose     This is the modern solution  Here is a small tutorial for that   There is also fit-content  which often works like min-content  but is more flexible   But also has worse browser support     This is a quite new feature and some browsers do not support it yet  but browser support is growing  See the current browser status here

User · Answer

I faced the same issue and I resolved it by using  max-width  fit-content

User · Answer

h2   display  inline

[css] Div Size Automatically size of content

Examples related to css