Widening Yogurt Theme

Permalink
Hi C5 fans

Does anyone know where the position of the dotted vertical divider is specified? I can see where the background image is called up in the main css file, but not how it's positioned.

I'm using mainly the left sidebar page type, and what happens when I set the page width say to 900px or so, is that the main content widens, but the divider image hasn't moved in the same percentage ratio and is too close to the main content whilst also being further away from the sidebar.

In the page source, there are other IDs and classes called up in the sidebar other than in the main css, so I suspect it's another css file - but where?

Thanks

Pete

peterfinch
 
Mnkras replied on at Permalink Reply
Mnkras
i believe kino made a wider version, its posted on the forums somewhere
peterfinch replied on at Permalink Reply
peterfinch
Hi

Thanks. Yes I've had a quick look at that, but the page is still 800px wide. That theme does, however, have three extra style sheets defining how sidebars are positioned and proportioned for each page type. That's what I can't find in the default.

I'd made a lot of changes to the default. I could switch to Kino's theme and apply all the mods again as a workaround I suppose.

Cheers

Pete
TheRealSean replied on at Permalink Best Answer Reply
TheRealSean
main.css:37
#page #central.central-left {
background: url(/concrete/themes/default/images/nav_sidebar_left_bg.gif) repeat-y center !important !important;
}


I Believe its a 800px x 8 gif, which is why it does not move, its then repeated on the y-axis, to edit the position you would need to edit the actual gif.

You could also hack the position with some CSS

repeat-y X(< adjust this value) 0;
you could make it less then or greater then 0 to position it from its default location
peterfinch replied on at Permalink Reply
peterfinch
Thanks mate

I've just opened the image in an image editor; like you said, it's 800px wide and only 8px high. Now I understand it! LOL.

I'd assumed it was like a positioned element, or like a visible border of a <div>.

No wonder I couldn't figure it. I can work with this now.

Thanks again.

Pete