driz Posted October 31, 2008 Share Posted October 31, 2008 Hi, please look at: http://simplecandy.com/about/I want to make it so the left box is ALWAYS the same size as the sidebar as a minimum (it can grow bigger than the sidebar if need be) but it must as bear minimum be the same size as the sidebar (which changes size per page and content etc)Thanks. x Link to comment Share on other sites More sharing options...
rzea Posted October 31, 2008 Share Posted October 31, 2008 Equal height columns?Easy, go here and implement: http://www.killersites.com/blog/2006/matching-div-heigths/Call the Javascript file from your page and add the class "columns" to the DIVs you want with the same height.Bytes, Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 I've applied the JS and added the classes, but it's not working? Do you know why? See http://simplecandy.com/about/ Link to comment Share on other sites More sharing options...
jeffman Posted October 31, 2008 Share Posted October 31, 2008 For starters, you have this line:<div id="sidebar" style="column">Where you want this:<div id="sidebar" class="column">My FF Error Console also points out a bunch of other errors in simplecandy.css Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 okay fixed that both the sidebar and maincontent have the class column. still no luck? Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 any ideas? would really appreciate this, thanks. x Link to comment Share on other sites More sharing options...
rzea Posted October 31, 2008 Share Posted October 31, 2008 FYI, you have a TON of warnings there:line 22 column 5 - Warning: <noscript> isn't allowed in <head> elementsline 22 column 5 - Warning: trimming empty <noscript>line 22 column 5 - Warning: inserting implicit <body>line 23 column 7 - Warning: <meta> isn't allowed in <noscript> elementsline 26 column 2 - Warning: <meta> isn't allowed in <body> elementsline 27 column 2 - Warning: <meta> isn't allowed in <body> elementsline 28 column 2 - Warning: <meta> isn't allowed in <body> elementsline 29 column 2 - Warning: <meta> isn't allowed in <body> elementsline 30 column 2 - Warning: <meta> isn't allowed in <body> elementsline 31 column 2 - Warning: <meta> element not empty or not closedline 31 column 2 - Warning: <meta> isn't allowed in <body> elementsline 31 column 2 - Warning: <meta> missing '>' for end of tagline 31 column 2 - Warning: <meta> attribute "/" lacks valueline 33 column 2 - Warning: <link> isn't allowed in <body> elementsline 34 column 2 - Warning: <link> isn't allowed in <body> elementsline 36 column 2 - Warning: <link> isn't allowed in <body> elementsline 52 column 1 - Warning: </head> isn't allowed in <body> elementsline 54 column 1 - Warning: discarding unexpected <body>line 174 column 11 - Warning: <a> attribute "href" lacks valueline 175 column 11 - Warning: <a> attribute "href" lacks valueline 188 column 11 - Warning: <a> attribute "href" lacks valueline 189 column 11 - Warning: <a> attribute "href" lacks valueline 190 column 11 - Warning: <a> attribute "href" lacks valueline 191 column 11 - Warning: <a> attribute "href" lacks valueline 192 column 11 - Warning: <a> attribute "href" lacks valueline 193 column 7 - Warning: missing <li>line 194 column 11 - Warning: <a> attribute "href" lacks valueline 195 column 11 - Warning: <a> attribute "href" lacks valueYou need to close this meta tag: <meta name="keywords" content="Design, Development, XHTML, CSS, Web 2.0, Web Standards" /Why don't you make a simple call to the Javascript file instead of using this?: http://simplecandy.com?js=MatchingHeightThe rest of the code seems ok to me...Fix your HTML first, probably doing that will make other pieces work. Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 Those HTML error arn't what's causing the problem, the JS file is virtual, hence why it has a link like that instead of a direct link to the file.It would seem to me that this is a CSS issue. x Link to comment Share on other sites More sharing options...
rzea Posted October 31, 2008 Share Posted October 31, 2008 Glad to help.Good luck. Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 Glad to help.Good luck.I take it you don't know what the problem is? Link to comment Share on other sites More sharing options...
jeffman Posted October 31, 2008 Share Posted October 31, 2008 I think maybe the matchColumns function in the MatchingHeight script never gets called. The end of the script assigns the matchColumns function to the window.onload event. But your body tag assigns a different function to the onload event. Since the body tag gets read after the script, the body tag wins. You'll need to adapt those bits so that both functions get called. Link to comment Share on other sites More sharing options...
driz Posted October 31, 2008 Author Share Posted October 31, 2008 I think maybe the matchColumns function in the MatchingHeight script never gets called. The end of the script assigns the matchColumns function to the window.onload event. But your body tag assigns a different function to the onload event. Since the body tag gets read after the script, the body tag wins. You'll need to adapt those bits so that both functions get called.OKIES That is the problem, I have disabled the onload for now, but I need it for my Zoom, how can i get them both to work together nicely? Thank you Link to comment Share on other sites More sharing options...
jeffman Posted October 31, 2008 Share Posted October 31, 2008 I know you borrowed the columns script, so this is not directed at you. BUT: it's crazy to put a window.onload assignment in an external script when you're loading multiple scripts. I don't know why a script author would write a script that way when it's intended for public use. The event handlers are bound to get overwritten. So, first, completely REMOVE this part of the MatchingColumns script: window.onload=function(){ if(document.getElementsByTagName){ matchColumns(); } } Also, permanently remove the onload assignment from your body tag. Then, add this short script to the about document: <script type="text/javascript"> window.onload = function(){ matchColumns(); setupZoom(); } </script> The DOM has an "official" way of attaching multiple functions to the onload event, but it is not widely supported. For the foreseeable future, this is the way to do it. (getElementsByTagName IS widely supported now, so I wouldn't worry about it.) Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.