2 replies [Last post]
lucashaley
Offline
newbie
Portland, OR
Last seen: 13 years 6 weeks ago
Portland, OR
Timezone: GMT-8
Joined: 2008-02-25
Posts: 2
Points: 0

Heya all --

This will probably be really simple, though I've checked in a lot of places and tried a lot of the standard hacks (holly, tan, etc.)

Basically, the layout is two-column centered. The content column shows up below the left column in IE, even though the div starts at the correct height. Please see the two attached images for an idea, or check out the BrowserShots at:

https://browsershots.org/http://profile.lucashaley.com/education/

Thanks for any help! I'd be super grateful!

-Lucas

Here is the HTML:



Profile Theatre: Education Program



function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])
if ((version >= 5.5) && (document.body.filters))
{
for(var i=0; i"
img.outerHTML = strNewHTML
i = i-1
}
}
}
}
window.attachEvent("onload", correctPNG);


  • Home
  • Newsroom
  • About Profile
  • 2007-2008 Season
  • Tickets/Subscriptions
  • Education Program
  • Donate
  • Links We Love
  • Contact
  • Email:

    Latest News

    Mark your calendars for 11 Seasons, 6 Degrees, 2 Gentlemen! (02/19/08)


    Be with us to celebrate our 11th season of presenting the work of a single playwright.



    The Oregonian Praises A Few Stout Individuals (02/19/08)


    "The Profile production has much to praise, including a cast that is strong from top to bottom and a set and costumes that aid unobtrusively in the separation and blending of the imaginary and the real."




    Education Program

    Profile Theatre firmly believes the value of an informed, educated audience. We support this by providing educational opportunities to learners of all ages- from community members attending performances to high school students studying theatre.




    if(typeof sIFR == "function"){
    sIFR.replaceElement(named({sSelector:"body h1", sFlashSrc:"/sifr/democratica.swf", sColor:"#000000", sLinkColor:"#000000", sBgColor:"#f0f2e6", sHoverColor:"#CCCCCC", nPaddingTop:0, nPaddingBottom:0, sFlashVars:""}));
    };

    and the CSS:

    /* Start of CMSMS style sheet 'ProfileTheatre' */ html, body { color: #111; font-family: 'Times New Roman', Times, FreeSerif, Likhan, Serif; margin: 0 auto; padding: 0px; } body { background-color: #5A5E51; min-width: 720px; } a { text-decoration: none; color: #39376e; } #container { background-color: #f0f2e6; background: url(/uploads/images/Layout/backdrop.gif) repeat-y; width: 720px; margin: 0 auto; border-bottom: 1px solid black; padding-top: 40px; padding-bottom: 10px; } #navigation { float: left; display: block; width: 240px; padding-top: 55px; margin-right: 30px; height: 100%; /* border: 1px dashed yellow; */ } #navigation ul { list-style-type: none; } #navigation li

    {
    text-align:right;
    font-size: 0.8em;
    font-style: italic;
    }
    #navigation a
    {
    border: 0px;
    }
    #navigation img
    {
    border: 0px;
    }
    #content
    {
    margin-left: 270px;
    padding-right: 10px;
    /* border: 1px dashed red; */
    /* width: 450px; */
    /* overflow-x: hidden; */
    }
    #header
    {
    margin: 0 auto;
    /* border: 1px dashed blue; */
    }
    #banner
    {
    text-align: left;
    background-color: #000;
    width: 450px;
    }
    #banner img
    {
    border: 1px solid black;
    border-right: 0px;
    }
    #copy
    {
    padding-top: 10px;
    padding-right: 10px;
    }
    #footer
    {
    text-align: center;
    font-style: italic;
    font-size: 0.7em;
    clear: both;
    }

    /* News */
    .NewsSummary
    {
    display: block;
    width: 190px;
    margin-left: 40px;
    font-size: 0.9em;
    margin-bottom: 10px;
    /* float: left; */
    }
    .NewsSummaryTitle
    {
    font-weight: bold;
    }
    .NewsSummaryContent
    {
    font-style: italic;
    font-size: 0.8em;
    }
    .NewsSummaryMorelink
    {
    display: block;
    text-align: right;
    }

    /* End of 'ProfileTheatre' */

    /* Start of CMSMS style sheet 'sIFR-screen' */
    /* These are standard sIFR styles... do not modify */

    .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    }

    .sIFR-replaced {
    visibility: visible !important;
    }

    span.sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
    }

    /* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
    .sIFR-flash + div[adblocktab=true] {
    display: none !important;
    }

    /* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

    .sIFR-hasFlash h1 {
    visibility: hidden;
    }

    .sIFR-hasFlash h2 {
    visibility: hidden;
    letter-spacing: -9px;
    font-size: 55px;
    }

    .sIFR-hasFlash h3 {
    visibility: hidden;
    letter-spacing: -6px;
    font-size: 25px;
    }

    .sIFR-hasFlash h4 {
    visibility: hidden;
    letter-spacing: -5px;
    font-size: 21px;
    }

    .sIFR-hasFlash h5#pullquote {
    letter-spacing: -4px;
    visibility: hidden;
    font-size: 24px;
    }

    /* End of 'sIFR-screen' */

    AttachmentSize
    bad_small.png131.38 KB
    good_small.png217.16 KB
    nonbreakingspace
    Offline
    Enthusiast
    Auckland, New Zealand
    Last seen: 10 years 37 weeks ago
    Auckland, New Zealand
    Timezone: GMT+12
    Joined: 2008-02-24
    Posts: 64
    Points: 1

    Hey there, try

    Hey there, try this.

    Change

    #content { margin-left: 270px; padding-right: 10px; /* border: 1px dashed red; */ /* width: 450px; */ /* overflow-x: hidden; */ }

    to:

    #content { float: left; /*padding-right: 10px; */ /* border: 1px dashed red; */ width: 440px; /* overflow-x: hidden; */ }

    If you float the #content div left, it can stack up next to the #navigation div. Remove the margin so it doesnt push anything out where it shouldnt. Change the width to 440px, coz 450px is to big in IE (6 only i think) and it'll wrap incorrectly.

    Lemme know if that doesnt work.

    lucashaley
    Offline
    newbie
    Portland, OR
    Last seen: 13 years 6 weeks ago
    Portland, OR
    Timezone: GMT-8
    Joined: 2008-02-25
    Posts: 2
    Points: 0

    Got it

    Heya --

    Thanks for the reply. I went through a re-created the html and css, this time slowly and checking my work as I went. I think I got it.

    -Lucas