bpopup icon indicating copy to clipboard operation
bpopup copied to clipboard

Center the concent vertically

Open alliquot opened this issue 10 years ago • 2 comments

Hello, dinbror,

First of all, thank you very much for providing such a nice component. I really love it.

I'd like to ask you for some help: is there any way to center its content vertically? I have some lines of a message to display but cannot center it.

Let's assume this is the content:

<div id="element_to_pop_up">
        <div id="content">Some text
        some<br/>
        text<br/>
        here<br/>
        ...<br/>
         </div>
</div>

I don't know size of the content. I've tried to add another container and use display:table and table-cell with vertical-align:middle:

<div id="element_to_pop_up">
        <div id="becomes_a_table">
            <div id="content_becomes_a_table_cell">Some text
        some<br/>
        text<br/>
        here<br/>
        ...<br/>
          </div>
       </div>
</div>

But I cannot set the "table" div's height to 100% of the popup. It doesn't resize to fill the parent entirely. Thus, I can see only a small div with my text in the left upper corner of a bPopupped div. The content is centered inside the table, but the table doesn't expand to a whole container.

Could you provide a simple example on how to center vertically some strokes of a text inside?

alliquot avatar Oct 29 '15 12:10 alliquot

Have you tried to set "amsl" to 0?

$('#element_to_pop_up').bPopup({ amsl: 0 });

dinbror avatar Nov 10 '15 21:11 dinbror

Thanks @dinbror. Adding amsl:0 solved my issue.

thomsebastin avatar Jun 02 '16 06:06 thomsebastin