Page 1 of 1

Changing top and bottom margins for <choicetable>

Posted: Fri Apr 01, 2016 12:10 am
by mspell
I need to expand margins above and below <choicetable> for webhelp.

The oxygen > frameworks > dita > css > core > -task.css file provides these default margins:

Code: Select all


*[class~="task/choicetable"] {
/* -task_step_child- >>> */
/* margin: 0.5em 0.5em 0.5em 4em; */
/* <<< */
}
My preferred margins are:

Code: Select all


*[class~="task/choicetable"] {
/* -task_step_child- >>> */
/* margin: 4em 0.5em 4em 4em; */
/* <<< */
}
I added a task.css file with the preferred margins to oxygen > frameworks > dita > DITA OT > plugins > com.oxygenxml.webhelp > oxygen-webhelp > resources > css folder. I set the args.css to the path to the new task.css and set args.copycss to yes. I generated webhelp using the DITA Map Webhelp option. In the webhelp output, the task.css file with the preferred margins was in the out > webhelp > oxygen-webhelp > resources > css folder. However, choicetables in the webhelp topics appeared with the default margins.

How do I need to specify these <choicetable> margins to override the default margins?

Thank you for any advice or guidance you can provide.

Re: Changing top and bottom margins for <choicetable>

Posted: Mon Apr 04, 2016 5:07 pm
by bogdan_cercelaru
Hello,

To customize the elements generated by WebHelp transformation you should find the CSS selector needed to style it.
You can use the "Inspect" action in the Chrome browser (or "Inspect element" in Firefox) to do this. For example, for "choisetable" element you should use the ".choicetable" CSS selector.
Your custom CSS file should look like:

Code: Select all


.choicetable {
margin: 10px;
}
Note that it is not necessary to have your CSS file saved to oxygen > frameworks > dita > DITA OT > plugins > com.oxygenxml.webhelp > oxygen-webhelp > resources > css folder. It can be on your Desktop or any other location on your PC.

You should set the "args.css" parameter to point to the custom CSS file and also set the "args.copycss" parameter to "yes". The CSS file will be copied in the root directory of the output folder.

Regards,
Bogdan

Re: Changing top and bottom margins for <choicetable>

Posted: Mon Apr 04, 2016 8:03 pm
by mspell
Thank you very much! Your advice solved the problem.