Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Problem with the design in Opera 9 / Netscape / Firefox
Hello!
I have a problem on my Vanilla forum:
http://www.limundo.com/limundocafe/discussions/
The white background does not follow the size of the discussion.
Same problem with categories (link name: Kategorije).
But on the search site (link name: Trazi) everything is OK.
And to make it more interesting, on IE all works without a problem.
I have a problem on my Vanilla forum:
http://www.limundo.com/limundocafe/discussions/
The white background does not follow the size of the discussion.
Same problem with categories (link name: Kategorije).
But on the search site (link name: Trazi) everything is OK.
And to make it more interesting, on IE all works without a problem.
0
This discussion has been closed.
Comments
Do have any hints how to solve it?
Thanks 3stripe
The soluton
works great.
Also changing to 1%.
Sorry about that, I gave you the wrong line number. For some reason Firebug said it was line1, I guess Vanilla dynamically optimizes the CSS. I checked your site again and it still says you are using height 100%, here is the correct fix:
The correct line is 1525 for vanilla.css. It originally says:
/* IE Rendering Fixes */ #Body, #Form h2, #Form p {height: 1%;}
Try changing it back to that.
http://www.limundo.com/limundocafe/discussions/
#Body, #Form h2, #Form p {height: 1%;}
#Body, #Form h2, #Form p without height
http://alistapart.com/articles/fauxcolumns/
overflow: hidden; _height: 1%
overflow: hidden; _height: 100%
overflow:auto;
I put it every combination in:
#Body,#Form h2,#Form p {
body {
body,div,table,td {
Result: None of them works.
In Opera the white background does not go to the bottom.
In IE the mess up is bigger, since the text is not centered, and it expands to the right corner.
I uploaded the unoptimized CSS (in original the whitespace is removed) for better visibility.
#Body,#Form h2,#Form p { overflow: auto; background-image: url(pozadina100.gif); background-repeat: repeat; margin: auto; }
Note: no height infos
(I had to add http://www.limundo.com/limundocafe/themes/vanilla/styles/default/... in front of the file to get it to show up in 'Edit CSS' mode on the webdev bar)
Also, the faux-column approach should work too, but you need to make your faux-columns as the background url to the HTML tag body, not the div#Body. You also need to make a wide graphic with a white central stripe and gridded edges as described in the article and use repeat-y and centred positioning as the article describes.
It solved the problem.
I have forgotten to clear the "Height:100%" parametre.
So not it works for Opera and Firefox.
But unfortunately this does not solve the problem in IE7.
The problem here is that the content is moved to the right.