Landing Pages - Update Widget CSS for advanced custom formatting

Below you will find some examples of CSS formatting together with the code: 

 

For each example you will see the

- final product
- css widget
- the code for the element that you can simply copy into your css widget

 

NOTE: image links in the files need to be replaced with images stored in your own company environment. 

 

 

{
"color": "#000000",
"width": "220px",
"height": "120px",
"fontsize": "35px",
"background": "#C0C0C0",
"borderRadius": "10px"
}

 

 

 

{
"color": "#FFFFFF",
"width": "200px",
"border": "1px solid #FCFBFB",
"height": "80px",
"fontsize": "35px",
"background": "#000000",
"paddingLeft": "10px",
"borderRadius": "10px",
"paddingRight": "10px"
}

 

 

 

{
"color": "#ED1C24",
"lineHeight": "0.5",
"fontSize": "16px"
}

 

 

{
"background": "#ED1C24",
"height": "1px"
}

 

 

 

 

{
"color": "#70C24A",
"height": "120px",
"fontSize": "20px",
"lineHeight": "0.6",
"paddingTop": "1px",
"backgroundSize": "300px",
"backgroundImage": "URL(https://cc.scantrust.com/c/353/stcfile/blob-oqiaga)",
"backgroundRepeat": "no-repeat"
}