XTypo not displaying correctly

Hi Guys,
I have just purchased and installed Xtypo content and button.
I have successfully integrated it into my jce editor and it works to a degree.
Unfortunately the buttons 1, 2, and 3, when applied to text seem to make no difference at the editor, nor at the front end.
If I select any of the note boxes, they look fine in the editor, but are very narrow in the front end, with the symbols missing, or off the page.
There may be other errors, that I have not yet discovered.
I am using joomla 3.1.5, my back end template is the standard isis, and my front end template is a J-BusinessDirectory by cmsjunkie.com .
Any help would be much appreciated

Hello

can you point me with the exact URL where you're using xtypo element?

Thanks for such a fast response, please feel free to go into the back and play:
garageforum.co.uk/index.php/terms-and-conditions

Hi

The button is fine if you give them an anchor tag inside it.
Regarding the notebox that too narrow that's caused by your template css file thas override the margin and padding property of the paragraph tag

template.css line 1660

.item-page p, .item-page pre, .item-page blockquote, .item-page ul, .item-page ol, .item-page h1, .item-page h2, .item-page h3, .item-page h4, .item-page h5, .item-page h6 {
margin: 12px 0;
padding: 0;
}

so you might want to re-override all the xtypo paragraph property to be more power than p tag above from your template.css

.xtypo-alert, .xtypo_info, .xtypo_warning, .xtypo_sticky, .xtypo_feed, .xtypo_download {
...
margin: 20px 0 !important;
padding: 0.5em 1em 0.5em 40px !important;
}

Thats absolutely brilliant, worked a treat. Thank you very much. Unfortunately I still seem to be missing my icons at the front for say the Alert or download, any suggestions?

That because now you have xtypo classes definitions inside your template.css meanwhile the icon image is inside the xtypo assets folder. So, you may remove the background image porperty of those xtypo alert, info etc from your overriden xtypo css in template.css i.e

.xtypo-alert .iconxt-alert {
background: url("assets/sprites.png") no-repeat scroll 0 0 transparent;
...
}

delete that background property, let it come from the xtypo css file.