Wikispaces allows users to present math notation by incorporating chunks of LaTex markup into their pages. The wikispaces server will render these chunks as images containing math notation. However, as it currently stands, this feature can only produce math notation on its own separate line, not inline in a paragraph of text. This is a considerable handicap.

A solution for inline math

One approach to make the math images appear inline is to create some additional addon functionality using the "CSS cue" technique. In this case we can create the entire solution using just CSS and a small image.

The idea is to place a small "cue" image before each piece of math markup, to indicate that we want that markup to appear inline. In the editor, that looks like this:
(This is a screen-cap image)
img-mathinline-001.gif

To complete the functionality, we supply some CSS which tells browsers that when they see our cue image, do the following:
  • Make the cure image invisible (since it's irrelevant for readers).
  • Hide the subsequent line-break
  • Hide the line-break that occurs after the subsequent image (the image actually containing the math).

Result of above-pictured LaTex


The inline math feature uses a "cue" image which, in the editor, you will see next. cue_mathinline.gif

When viewing the page as the reader sees it, no cue image, and the math is inline.

(Try changing browser width to convince yourself that the math really is inline.)

Image and CSS to implement this effect

Here is a reasonable image to use for this purpose: cuex_mathinline.gif Save it, rename it to "cue_mathinline.gif", and upload it to your wikispaces site, so you can later insert it in your own pages. Note: it's tedious to fetch that image using the wikispaces "File" feature every time. So instead, after you've placed the image on your page once, while in the editor you can just copy and paste it to other locations on the page as needed.

The CSS that creates the inline effect appears below, and can be added to your site CSS, or loaded as a separate CSS file. Adding this to your site CSS (aka "Custom Stylesheet Additions") is the straightforward way, but CSS editing is only available to paid accounts like Plus. You can add the CSS using Javascript if you are savvy about that sort of thing: Javascript load CSS file.
Here's the CSS to add:
/*------------------------*/
/* addonMathInline.css  GW  */
/*------------------------*/
 
div.contentBox .wiki img[src*="cue_mathinline"],
div.contentBox .wiki img[src*="cue_mathinline"]+br,
div.contentBox .wiki img[src*="cue_mathinline"]+br+img+br
{
  display: none;
}
 

Issues

This CSS depends on the [src*="..."] attribute selector feature, which is introduced in CSS 3, but seems well supported in common browsers: http://www.quirksmode.org/css/contents.html (see "Advanced [attr] selectors"). Even if it fails, it's not a disaster; the viewer will simply see the math on a separate line.

Page Info
Image prefix: img-mathinline-nnn.gif/jpg