Elxis CMS Forum
Support => Elxis 4.x/5.x DEV => Topic started by: seadhna on April 12, 2013, 19:16:48
-
Hi there,
I have created a responsive theme that works in measurements of percentages and ems only for full-screen display on all devices. I need the image width on articles to be a percentage of the parent container or measured in ems rather than pixels. How can I alter the core code so that the dropdown in the CMS - Extensions > Components > Content > Medium Image Width
provides options in percentages or ems rather than just pixel options?
e.g. to have the option to choose 30% as the image width.
Many thanks for your help as always!
-
Don't bother with that in this case, set your preferable image width in percentage or ems in your CSS.
Example
div.elx_content_imagebox { width:40% !important; }
div.elx_content_imagebox img { width:98%; padding:1%; }
The width of the image container div.elx_content_imagebox element is relevant to the article container div.elx_article_page
So if the width for the div.elx_article_page is 200px the width of the div.elx_content_imagebox will be 80px (40%).
-
Hi there,
thanks for your reply. The problem is that a width (in pixels) and a float (left) are hardcoded by the CMS inline:
<div class="elx_content_imagebox" style="margin:0 5px 5px 0; float:left; width:330px;">
-
Have you tested what I wrote?
!important overwrites in-line css. You need float even for percentage. If you don't want float select to display a large picture on top of the article, not the medium one on the left side. You can then apply float or anything else you want from the CSS.
An other solution is to build and use a custom image plugin with your own html output.
-
Sorry - didn't realize - thanks very much, that's working great now.