The issue is that the contents of the sidebar are wrapped in * elements, which happen to have "text-align: right". If you style #sidebar, the styling on the list elements will take preceden
(note: I have included a commented copy of the original value for each property I changed) <br />#sidebar {<br />/* width: 12em; */<br />width: 20em;<br />}<br />#passage
All I want to do is make the sidebar wider and shift the main passage area over so they don't overlap. I can move and resize the text just fine, using a width value under #sidebar, but there's a 1 px
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 l
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 F
2. Make the #ui-bar (or #sidebar) underpin the minimap (the minimap will not be harmed). For instance, change this style: <br />#sidebar, #ui-bar<br />{<br />top: 240px;<br />
2. Put this in a stylesheet tagged passage: <br />#sidebar, #ui-bar<br />{<br />top: 240px;<br />}<br />#minimap<br />{<br />position:fixed;<br />left:
I'm assuming that you're asking because of the penchant some have for hiding the sidebar via CSS (e.g. #sidebar { display: none; }). Doing so does not actually remove the sidebar, so the functioning