Welcome to Joel Lipman .Com

Preparing Content...


Loading...

Our Website Development Notes

We hope this helps!

Articles // Web Development // CSS StyleSheets

Change div height to fit content

Monday, 19th December 2016
1,741 Reads
Applies to:
  • CSS
  • HTML
What?
A quick article on how to get a div layer to increase height based on how a heading fits on a page.

What?
I have a heading like this:
The heading in full width
The code of this is:
  1. <div id="page-title" class="col-xs-12">  
  2. <h1><a href="/">A long heading that wraps over several lines</a></h1>  
  3. </div>

When I shrink the browser, I get a heading like this:
The heading in narrow width (text overlap)

I want this to happen:
The heading in narrow width (fixed)
The code of this is the addedn overflow:hidden;height:1%;:
  1. <div id="page-title" class="col-xs-12" style="overflow:hidden;height:1%;">  
  2. <h1><a href="/">A long heading that wraps over several lines</a></h1>  
  3. </div>

Source(s):



Recent Comments

Gravatar for Art
Oracle: order by subquery missing right parenthesis
Hello, what if I would like to add rownum to that code, but in my case it's all is subquery? How can I do this ?

20 Jan


Gravatar for Robert
CharIndex Reverse - find occurrence starting from end of string in TSQL
Very helpful thanks! This worked for me as well, and is a little shorter. Not sure if there are drawbacks. SELECT RIGHT(@Haystack,CHARINDEX(@Delimiter,REVERSE(@Haystack))-LEN(@Delimiter))

29 Dec


Gravatar for Translation

27 Dec


Gravatar for Tibbe
JComments 2.3.0 with ReCaptcha in Joomla 2.5.x
Hi there, This looks like a great solution to get rid of spam comments. How to integrate this in Joomla 3.x? Step 2 I did in settings.xml, but no result in frontend. Kind Regards, Tibbe

16 Dec


Gravatar for sach|n
SSRS Repeat Headers in PDF Report
Yes its working for me..thnx Joel.

7 Oct