<div>
Line 280 of rowbyVeggieCustom.scss... assigns a width to the inner div of 51%.
<pre><code id="code-20-41568424-1">.modal-box {
    width: 51% !important;
}</code></pre>
This means that 49% of the parent width is unused or white space.
</div>


Line 280 of rowbyVeggieCustom.scss... assigns a width to the inner div of 51%.

.modal-box {
    width: 51% !important;
}

This means that 49% of the parent width is unused or white space.

<div>
Hi Kim<br />
<br />
Thanks for helping on this.<br />
<br />
I put that &quot;51%&quot; in the css in to handle the width of the text content. So that's okay.<br />
<br />
However I need the width of the modal itself not to be full width. &nbsp;I need it to be about 60 percent of the width of the page.<br />
<br />
And I need the bottom of the text area not to be cut off. &nbsp;See below for approximately how I want it to look (and also not cut off the bottom of the text area.<br />
<a href="https://filedb.experts-exchange.com/incoming/2016/04_w18/1093890/narrower-2.jpg" target="_blank" title="Modal needs to be narrower, right and left -- and not cut off the bottom of the text area. (37 KB)"><img alt="Modal needs to be narrower, right and left -- and not cut off the bottom of the text area." class="file-block lazyload" style="max-width: 799px;" data-src="https://filedb.experts-exchange.com/incoming/2016/04_w18/1093890/narrower-2.jpg" /></a><br />
Rowby
</div>


Hi Kim

Thanks for helping on this.

I put that "51%" in the css in to handle the width of the text content. So that's okay.

However I need the width of the modal itself not to be full width.  I need it to be about 60 percent of the width of the page.

And I need the bottom of the text area not to be cut off.  See below for approximately how I want it to look (and also not cut off the bottom of the text area.
Modal needs to be narrower, right and left -- and not cut off the bottom of the text area.https://filedb.experts-exchange.com/incoming/2016/04_w18/1093890/narrower-2.jpg
Rowby

Modal needs to be narrower, right and left -- and not cut off the bottom of the text area.

narrower-2.jpg

<div>
Hmm &nbsp; I'll try the margin suggestion on the container. &nbsp;That might do it.<br />
<br />
Rowby
</div>


Hmm   I'll try the margin suggestion on the container.  That might do it.

Rowby

<div>
<div class="content wysiwyg-content">
Hello CSS Experts,<br />
<br />
Me again.<br />
<br />
Doing some fine tuning on the popups of this page: &nbsp;<a href="http://www.theveggierepublic.com/pages/veggie-team" rel="ugc">Poppup width and height issues....</a><br />
<br />
If you click on the images for their &quot;popups&quot; &nbsp;you'll see most of them have have white space on the right and left that is too wide. &nbsp;<br />
<br />
And you'll also see that the text on the bottom of the popups are usually cut off.<br />
<br />
<a href="https://filedb.experts-exchange.com/incoming/2016/04_w18/1093856/modal-issues.jpg" target="_blank" title="Screen capture (191 KB)"><img alt="Screen capture" class="file-block lazyload" style="max-width: 800px;" data-src="https://filedb.experts-exchange.com/incoming/2016/04_w18/800_1093856/modal-issues.jpg" /></a><br />
Thanks for any help.<br />
<br />
Rowby
</div>
</div>


modal-issues.jpg

Hello CSS Experts,

Me again.

Doing some fine tuning on the popups of this page:  Poppup width and height issues.... (http://www.theveggierepublic.com/pages/veggie-team)

If you click on the images for their "popups"  you'll see most of them have have white space on the right and left that is too wide.  

And you'll also see that the text on the bottom of the popups are usually cut off.



Thanks for any help.

Rowby

Height and width issues with popup

Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.