Question

I'm having difficulties moving my left bar downward about 60 pixels.

We have inserted a logo at the top left our page where the twiki robot went. Our logo is larger heightwise.

I'm having two issues:

1. I keep editing the layout.css file and whatever change I make, the leftbar doesn't move down a bit, keeping the middle box stable.

What's happening is that the left bar will take up the entire top of the page - page-wide rows of left bars stretched across - pushing the middle box down underneath the left bar. I've tried separating the middle container and left bar classes into classes of their own.

I've also played with leaving those alone and increasing the height of the top bar. No matter what I do, I get the same results.

2. We've selected to create a skins and layout page, tracking our updates there. We point to the layout file from the TWiki preferences. This is working very nicely for the style, but for the layout. However, for the layout, I was running into the problems stated in 1. above. So...I overwrote my layout file with the original layout file for now (until I figure out how to fix number 1.)

HOWEVER, even with the original layout (renamed to layout_softgreen.css) uploaded, I still see my weird leftbar stretched across the page, middle container below that layout.

It's really confusing me because no reiteration of my layout changes worked previously. I must have hit the right settings at some point in my trial-and-error; however, I wasn't able to tell because the wiki keeps displaying the same thing.

The only way I can get the layout to go back to normal (which cuts my logo in half, but at least my page is laid out properly) is to point to the original layout on the server. I don't know why this would be different than pointing to the same layout that's in my skins and layouts twiki page.

Environment

-- LisaAkari - 10 Jan 2006

Answer

Also, may I add:

I can get a test web page layout looking great in IE and somewhat ok in Firefox. But as soon as I upload it to the twiki and point to it, all is like in comment 1 above.

Rather frustrating, since I can make it look great off the web in both browsers, but as soon as it hits the online twiki it displays incorrectly.

Here's my code btw:

.twikiMiddleContainer {}
.twikiLeftBar {
   top:60px;
   margin-top:48px;
}
.twikiTopBar {
   height:60px;
}

That has scooted things into perfect position in IE. However, in Firefox, the leftbar is moved down, while the middle container has retained its position. This is in offline mode only. As I explained, when I upload it, the webleft bar splays across the page, then the middle container under it, no matter what changes I make to the layout.

-- LisaAkari - 10 Jan 2006

OK... MUST layouts be called layout.css? Nothing else? Because when I renamed my layout to layout.css it worked for me. Everything moved into its appropriate place.

Any tips on how I can keep all the layouts in one page then, but separate? The only thing I could think of is, if I have 3 layouts I like, and want to use different ones, is to name the current one layout, and rename the others. ??

I'd like confirmation on that the file must be called layout.css. My style is working fine and is not called style.css.

-- LisaAkari - 10 Jan 2006

Lisa, do you have a url I can look at? I looks like you've deleted some code from layout.css. Please give your stylesheets the extension .css, some browsers may fall over it otherwise.

Also, what TWiki release version are you using? DakarRelease is imminent, and changes to PatternSkin are better documented there. See for instance ViewDEVELOP:TWiki.PatternSkinCustomization.

Any tips on how I can keep all the layouts in one page then, but separate - not sure what you mean by this. Could you rephrase your problem?

-- ArthurClemens - 12 Jan 2006

OK. I got it to work in a way that was better by doing this:

.twikiMiddleContainer {} .twikiLeftBar { top:120px; } .twikiTopBar { height:120px;

It opened up the entire top section and moved everything underneath down nicely. It wasn't what I wanted at first. I wanted to ONLY move the left bar down. But what I have works for now.

However, in the future I might need to move the left bar only up or down.

Also it DID helped that I only named my layout layout.css. After I did that things looked better.

"Any tips on how I can keep all the layouts in one page then, but separate - not sure what you mean by this. Could you rephrase your problem?" --Arthur - I might want to make 3 or 5 different styles and potentially one or two more layouts. I would like to be able to load ALL those styles and layouts in one page called Skins and Layouts (you can see at my url below). Then I could just go to the preferences and change the name of the file...not the page location or anything. That would keep things super easy for us. However, maybe I must keep each skin+corresponding layout on its own separate page? I'm not sure anymore that I can throw up a bunch of unique named styles or layouts into one page, and then just point to those from within the preferences page.

The url I'm working on is gopedia.gopetslive.com. I believe I'm using release 1.85.

-- LisaAkari - 16 Jan 2006

Yes, you can attach all layout (or style) files to one topic, and point to each one of the files depending on the layout you need.

The site asks for authentication twice at every page. This can be solved by either upgrading to Dakar soon, or by pointing (in TWikiPreferences) USERLAYOUTURL and USERSTYLEURL to the file empty.css in the TWiki.PatternSkin topic.

-- ArthurClemens - 17 Jan 2006