Support » Themes and Templates » Need CSS help to fix site!

  • I’ve spent the last few weeks creating a web site for a film I am making. I used the wonderful 3 Column Relaxation theme. It looks great in Firefox and Safari, but it breaks in MSIE for windows. I see there is already a thread about some of these issues, but no resolution. Also, the problem I have is more complex, because I’ve added additional elements to the theme, and so my sidebar moves even in Firefox and Safari if there isn’t enough text on the left. And, finally, my site doesn’t seem to validate well for XHTML.

    Frankly, fixing these nagling problems is beyond my capabilities as a designer and I need help. This is for a good cause – it is a documentary film about an oppressed minority group in India – and so I’m just hoping that someone out there who is better at coding than I am can come to my rescue. I really want this site to work on Internet Explorer because that’s what most people still use!

    Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • OK. I think I fixed the problem. (Not yet uploaded to my site.) What I did is a created a new Div wrapper for the entire sidebar called “sidebarwrapper” and then, following the advice in this article I specified the width in pixels of both float elements: #wrapper and #sidebarwrapper. This seems to work in MSIE on the mac. Hopefully the same will be true on windows.

    PS: I also had to modify the page template to include a wrapper.

    OK. I’ve uploaded the changes. If you can, please help me look at the site on a few different browsers and platforms and tell me if you find anything funny! Thanks!

    http://hoochandhamlet.com/

    I’m glad you figured out a fix for this.

    Is it possible you can be more specific as to what you changed to make it work? Name the file you changed, the element, and the value you put in…

    thanks so much

    Sure. In Style.css I changed:

    #wrapper {
    float: left;
    margin: 0;
    padding: 0;
    }

    To

    #wrapper {
    float: left;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    width: 528px;
    padding: 0;
    }
    #sidebarwrapper {
    float: right;
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 0;
    width: 333px;
    }

    Then, in sidebar.php, I put:

    <div id="sidebarwrapper">

    at the beginning and a </div> at the end.

    I also reduced the width of both #sidebar and #sidebar2 from 128px to 118px.

    Cheers.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Need CSS help to fix site!’ is closed to new replies.