I've recently got into Twine and it's such a great application! Today I've been playing around with formatting my text with stylesheets. I don't really understand the CSS, so I have just copied some template stuff I found.
I have been having some problems with 1.4.1 and 1.4.2, neither seems to work entirely how I want it. Here's a quick breakdown:
1.4.1: browser will not respond to back button.
1.4.2. back button works, but the title of my story appears in large letters in the middle of the page, a bookmarks link is displayed far right of the screen and only half of the word is visible. Finally, images will not display inline.
I have had to downgrade back to 1.4.1 until I can figure out this problem.
Thanks in advance.
Which Story Format are you using when you build your HTML file?
(assuming your using the same Story Format in both 1.4.1 and 1.4.2)
Two of the changes were: a. to set a viewport property and b. to change the CSS positioning of the #sidebar area from absolute to fixed, and it may be these changes that are causing your problems as Firefox was fixing bugs related to viewport and position-fixed around version 17.
I would suggest updating to a later version of Firefox, if this is not possible then you may be able to use the older Sugarcane header files that come with 1.4.1 within 1.4.2 but this may cause issues.
To try using the Sugarcane header file from 1.4.1 in 1.4.2 do the following after installing 1.4.2 in a different folder/directory than 1.4.1:
1. Rename the 1.4.2 header files.
To do this locate the folder/directory you installed 1.4.2 in. Beneath this is one named targets and beneath that is one named sugarcane. Within this folder/directory are two files (code.js and header.html), rename them code.js.new and header.html.new respectively.
2. Copy the 1.4.1 header files.
Locate the similar targets\sugarcane folder/directory below the location you installed the 1.4.1 version of Twine and copy the two files (code.js and header.html) from there into the 1.4.2 targets\sugarcane folder/directory.
I tried the other solution with the heads but that didn't help either. It definitely changed some things but not in a good way.
Any other ideas?
Could you take a screen capture of the 1.4.2 output and attach it to a post, so I have same idea of what it looks like and if you could also attach an example tws file that produces the problem it would help.
> but the title of my story appears in large letters in the middle of the page
This is a result of your "#sidebar #title" and "#sidebar #title #storyTitle" rules, the first uses vertical-align and text-align to center the title and the second rule assigns a large 12em font to the title. End result a large title in middle of screen. > a bookmarks link is displayed far right of the screen
Your "#sidebar" rule caused the sidebar to be displayed on the right side of the screen and your "#storymenu, #snapback, #restart, #share, #credits" rule hides parts of the side-bar you did not want to see, so you need to add #bookmark to the second rule to also hide the bookmark link. > images will not display inline
As explained on this Twine Wiki page, you can either import your images into your story file or you can reference external images. The format of the img link you used is the imported image version but your sample TWS file contains no images.
eg. So you need to either import the jenga.jpg image into your story and use the name of the image passage within the link, or you need to host the images somewhere and change the img links to reference them using http://imagehost.com/image_name.jpg within the link.
I hope this helps.