Some text in a container with a height lower than 55px
Some other text in a container with a height lower than 105px
Some big text
... really big text...
... with a height bigger than 105px
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:f="http://xmlns.jcp.org/jsf/core" xmlns:b="http://butterfaces.org/components"> <h:head /> <body> <h:form id="formId"> <span class="btn btn-outline-secondary" onclick="new ButterFaces.Overlay(0, false, '.disableElementsContainer').show();"> Disable </span> <span class="btn btn-outline-secondary" onclick="new ButterFaces.Overlay(0, false, '.disableElementsContainer').hide();"> Enable </span> <div class="alert alert-info disableElementsContainer"> <div>Some text...</div> <div>Some other text...</div> <div><input value="An input field"></input></div> </div> /* add jQuery and jQuery plugins to html head part */ <b:activateLibraries /> </h:form> </body> </html>