Forum Discussion

bsamson's avatar
bsamson
Adept
11 years ago

Creating a Custom Page in Lithium Studio

What html code would I use to  add padding to a custom content module so that I can increase left and bottom margins?   Also, words in custom module are currently stacked and I would like them to b...
samudhraa's avatar
samudhraa
Expert
11 years ago

Hi bsamson ,

 

Here is a sample custom content , that would display links side ways . You can give custom styling in the global skin , and make it sepcific by mentioning Page class (.ForumTopic etc)  as well as class name for your html elements (div , span  etc)

 

Custom Content : 

<span>
<a href="">Explorer Hosted Events</a>
</span>
<span>
<a href="">Explorer Hosted Events</a>
</span>

 

CSS : 

.lia-panel.lia-panel-standard.CustomContent.Chrome.lia-component-common-widget-custom-content {
margin-left: 20px;
margin-bottom: 20px;
padding-bottom: 10px;
padding-left: 10px;
}

.lia-body .lia-content .lia-component-common-widget-custom-content .custom-title-link {
color: red;
}

 

This is how my component looks on page. You can modify css as per your needs.

testContent.png

 

Hope that helps.

 

Thanks,

Sam