I noticed in the description that the sidebars were going to be fixed width, but they are fluid as well. I was wondering if you could put out a version with fixed width sidebars and a fluid content, much like the Garland theme. Thanks

CommentFileSizeAuthor
#6 fixed-sidebars.patch1010 bytesJeff Burnz
#4 1012228.antonelli.fixed-sidebars.patch445 bytesjoachim

Comments

thomas4019’s picture

thomas4019 commented

subscribe

flightrisk’s picture

flightrisk commented

I'm also wondering about this and need fixed width sidbars. Does anyone have a quick fix? I took this theme and made my own subtheme from it, so I'm able to change any of the code. No one has responded yet, can someone help?

ryantollefson’s picture

ryantollefson commented

Here's my attempt. It seems to work in both Chrome & IE8.

Change the following two settings in antonelli\css\layout.css

.one-sidebar #content {
  /* width: 75%; */
  margin-left: 240px;
  margin-right: 10px;
}

.sidebar {
  /*width 24.25%; */
  width: 240px;
  margin-bottom: -100%;
}

I only needed the one-sidebar layout; though the same idea should apply to the two-sidebar settings.

joachim’s picture

joachim commented
Status: Active » Needs work
StatusFileSize
new 1012228.antonelli.fixed-sidebars.patch445 bytes

Here's that change as a patch -- but it doesn't work with two sidebars.

joachim’s picture

joachim commented

Also, on a page where the content is shorter than sidebars, they overlap the footer.

Jeff Burnz’s picture

Jeff Burnz commented
Status: Needs work » Needs review
StatusFileSize
new fixed-sidebars.patch1010 bytes

Could use display table, but really there are many ways to solve this, I will probably punt for altering the source order and switching to a negative margin layout, and throwing in some media queries to boot.

Patch uses display table, not tested very much, this will work on modern browsers, old IE I don't think so...

In essence the layout gets whittled down to this (a few other changes needed that are in the patch):

#main-wrapper {
  display: table;
  min-height: 300px;
}
#main {
  display: table-row;
}
#content,
.sidebar{
  display: table-cell;
}
.sidebar {
  width: 300px;
}
joachim’s picture

joachim commented

> I will probably punt for altering the source order and switching to a negative margin layout

I did a bit of tinkering trying to get the negative margin technique to work, but I'm afraid my CSS skills weren't up to it :(