Home/ Questions/Q 8117259
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-06T04:06:23+00:00

I think I already know the answer to this one, but i hope maybe

  • 0

I think I already know the answer to this one, but i hope maybe someone will have a some neat trick for that .

I want to specify a min-height of a DIV , but not px / % based . (I know it sounds strange , but it is for compatibility reasons / responsiveness)

Basically I want to be able to specify it by number of lines .

I have a grid of DIVS , but the elements inside are not fixed, so one element can have 3 lines, and the next one only 2 or 1 line . this messes up the layout .

Basically , what I need is THIS :

    =====================      =====================      =====================
    Lorem ipsum dolor sit      Lorem ipsum dolor sit      Lorem ipsum dolor sit 
    amet, consectetur          amet, consectetur          amet, consectetur
    adipiscing elit.
    =====================      =====================      =====================

    =====================      =====================      =====================
    Lorem ipsum dolor sit      Lorem ipsum dolor sit      Lorem ipsum dolor sit 
    amet, consectetur          amet, consectetur 
                               adipiscing elit.
    =====================      =====================      =====================

and NOT this : 

=====================      =====================      =====================
Lorem ipsum dolor sit      Lorem ipsum dolor sit      Lorem ipsum dolor sit 
amet, consectetur          amet, consectetur          amet, consectetur
adipiscing elit.           =====================      =====================
=====================
                           =====================      =====================
=====================      Lorem ipsum dolor sit      Lorem ipsum dolor sit
Lorem ipsum dolor sit      amet, consectetur          =====================
amet, consectetur          =====================  
adipiscing elit.             
=====================

can this sort of thing can be achieved by specified “I want 3 lines” ?
(As opposed to pixels, percentage / em ??)

Edit I

After comments –

What I really want is something like the FORM elements , INPUT or TEXTAREA where you can simply specify the height and width by lines / characters !

<TEXTAREA NAME=string, ROWS=n, COLS=n> </TEXTAREA>

It is hard o believe that no one has invented such a solution and left us all to struggle with PX / em / % calculations and the likes ..

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You should use a clearfix hack

    It will allow you to get your divs aligned without specifying any height. It’s like a line separator :

    =====================      =====================      =====================
Lorem ipsum dolor sit      Lorem ipsum dolor sit      Lorem ipsum dolor sit 
amet, consectetur          amet, consectetur          amet, consectetur
adipiscing elit.           =====================      =====================
=====================      
{clearfix}
=====================      =====================      =====================
Lorem ipsum dolor sit      Lorem ipsum dolor sit      Lorem ipsum dolor sit 
amet, consectetur          amet, consectetur          =====================
=====================      adipiscing elit.
                           =====================

    You still can set height / margin on each div, of course :

    EDIT :

    For an internal equal size without using tables, you’ve got several solutions :

    Using overflow:hidden on the parent and an extra margin-bottom on children if you only use background.

    Using display-table attribute (Method 1)

    Or using javascript (Method 3)

    • 0