joomla 5 module for vertical menu.

$max_width is a php code that get width for the menu by the module admin panel. this mean : if i set the width of the menu to 300px in admin panel , then $max_width will output 300px on the site .

this is my php code :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.'); margin-right: '.$max_width.' ; }';
?>

this code will resize the element #sp-main-body to be -300px .

my question is :

how can i add 10px to $max_width or take 10px from #sp-main-body ?

i try this :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.' - 10px); margin-right: '.$max_width.' ; }';
?>

and this :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.'); margin-right: '.$max_width.' ; +10px }';
?>

but it is not working !!

joomla 5 module for vertical menu.

$max_width is a php code that get width for the menu by the module admin panel. this mean : if i set the width of the menu to 300px in admin panel , then $max_width will output 300px on the site .

this is my php code :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.'); margin-right: '.$max_width.' ; }';
?>

this code will resize the element #sp-main-body to be -300px .

my question is :

how can i add 10px to $max_width or take 10px from #sp-main-body ?

i try this :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.' - 10px); margin-right: '.$max_width.' ; }';
?>

and this :

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.'); margin-right: '.$max_width.' ; +10px }';
?>

but it is not working !!

• php
• css

• Not tested, but why not try to do a nesting like calc(calc(100%-300px)-10px). – Markus Zeller Commented Jan 18 at 12:16
• i cant add this code without $max_width , i need it because i set the width in admin panel . – user28928120 Commented Jan 18 at 13:09
• Of course you need to substitute it with the variable! I just was too lazy. – Markus Zeller Commented Jan 18 at 13:50

1 Answer 1

To add 10px or subtract 10px in your calculation, you need to ensure that your syntax is correct in the CSS calc() function and also properly concatenate the strings in PHP. Here's how you can modify your PHP code to achieve this:

Adding 10px to $max_width in calc():

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.' + 10px); margin-right: calc('.$max_width.' + 10px); }';
?>

Subtracting 10px from $max_width in calc():

<?php
$custom_css .= '#sp-main-body {width: calc(100% - '.$max_width.' - 10px); margin-right: calc('.$max_width.' - 10px); }';
?>

May be you can try this one, not sure but hope this works!