Can we set and use tab characters?

livfoss · September 27, 2011 3:51 pm

I would love it if there were built-in tables in Sandvox, and I know I'm not alone: but just at the moment I'd settle for the ability set tab stops and to use 'tab' characters to line text up. AFAIK this doesn't work, indeed the tab character doesn't seem to be part of the character set recognised by Sandvox (tabs seem to skip to the next part of the page). The suggestion in the Help section that you can do this by using TextEdit to create the effect you want and then paste the result into Sandvox doesn't work for me, as the tab settings don't seem to transfer across and so the spaces created by them don't show up.

Does anyone know of a quick way of creating columns either by setting tabs or importing formatted text from another package? I have gone down the HTML-injection path for a full-blown table but this seems overkill for such a simple requirement.

terrence · September 27, 2011 5:03 pm

The problem is that tabs essentially don't exist in HTML. Just as multiple spaces do not. HTML collapses all of that "white space" to a single character. You can use non-breaking spaces, but the width of those change depending on the font used. A table editor is on our list for the future. (We have made progress. Bullet lists were first.)

livfoss · September 28, 2011 1:51 am

Thanks, I wasn't aware that HTML doesn't have a proper white space management system, although I do no some of the history of markup languages so I should have guessed. For the present I will either give up on the idea or insert another HTML table via an intermediate 'constructor' site like quackit as suggested in the Sandvox documentation. The only thing about this is the bag of warnings you get that your HTML is somehow old-fashioned - but it works.

macdafydd · September 28, 2011 5:30 am

Sounds as if you should be using CSS. With that you can make liquid columns easily enough. Trouble is, I don't know if you can easily insert that sort of CSS into a Sandvox document and expect it to remain there during updates and the like.

terrence · September 28, 2011 12:05 pm

macdafydd: that's what Site Code Injection, Style Sheet tab is for: put your CSS changes there, not in the design package so that the CSS changes travel with the document, not within the application/designs.

macdafydd · September 29, 2011 1:12 am

Thank you, Terrence.

So there you are, Livfoss, some CSS for columns; much nicer than tables.

macdafydd · October 2, 2011 8:13 am

Here's an example of a simple three-column layout, created in Sandvox, using CSS and HTML, with no recourse to tables:

3-column test

Site Code Injection was used to insert the CSS and the data was placed with Edit Raw HTML. (The text I used was merely copied and pasted from one of my sites: the underlining is because each title is also a link.)

Things to note: the background colour of all the columns stretches down to the footer; the text wraps in each column; the column widths can be changed in the CSS to be unequal; no graphics required to achieve the layout, no JavaScript.

It's all based on Matthew James Taylor's excellent http://matthewjamestaylor.com/blog/ulti … pixels.htm (and he offers plenty of other interesting CSS tips).

Last edited by macdafydd (October 2, 2011 8:14 am)

RX7RACE · October 2, 2011 11:23 am

I have downloaded this from Mathew James Taylor. Does anyone know how or where to be able to use it?
http://matthewjamestaylor.com/blog/perf … t-menu.htm
Thank you,
Peter

macdafydd · October 2, 2011 12:47 pm

Matthew's code is not specific to Sandvox. Matthew provides CSS code and an example of HTML which makes use of this CSS. You have to extract the appropriate CSS from the downloaded file screen.css (iy's the part form the /* column container comment to the /*Footer styles comment) and insert it into your Sandvox document, which you do with Edit>Site Code Injection… (or Page Code Injection…, depending on whether you want the CSS to apply to the whole site or just the page you are working on), then select the Stylesheet tab and paste the CSS in the resulting field. Close the Injection window (there's no Save, this being done automatically).

Now you work in the page you want the two-column layout to appear. Place a Raw HTML object there, select it and use the menu Edit>Edit Raw HTML… Replace the default HTML with the HTML copied and adapted to your own contents from Matthew's own page HTML: basically this is the part from <div class="colmask rightmenu"> up to and including the >/div> on the line preceding <div id="footer">.

Remember that Matthews own page actually makes use of both the CSS and HTML coding, so it's up to you to remove his text parts and replace them with your own, as required by yourself.

Here's a quickie I've just made, so you can see what it looks like in Sandvox:

2 Columns test

(Just one caveat: the fixed sizes of Sandvox designs preclude the liquidity of Mattews designs, which is a pity. To get an idea of what this means, take a look at my page http://davidneale.eu/elvis/originals/ and see what happens when you reduce the width of the window.)

Last edited by macdafydd (October 2, 2011 1:04 pm)

macdafydd · October 3, 2011 7:53 am

To make things somewhat easier, I have started a small site regarding the use of columns. No doubt I shall add other musings in the future. See it at http://davidneale.eu/sandvox/

Karelia Community Forum

#1 September 27, 2011 3:51 pm

Can we set and use tab characters?

#2 September 27, 2011 5:03 pm

Re: Can we set and use tab characters?

#3 September 28, 2011 1:51 am

Re: Can we set and use tab characters?

#4 September 28, 2011 5:30 am

Re: Can we set and use tab characters?

#5 September 28, 2011 12:05 pm

Re: Can we set and use tab characters?

#6 September 29, 2011 1:12 am

Re: Can we set and use tab characters?

#7 October 2, 2011 8:13 am

Re: Can we set and use tab characters?

#8 October 2, 2011 11:23 am

Re: Can we set and use tab characters?

#9 October 2, 2011 12:47 pm

Re: Can we set and use tab characters?

#10 October 3, 2011 7:53 am

Re: Can we set and use tab characters?

Board footer