Announcement

Collapse
No announcement yet.

Container location and erratic styling behaviour

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Container location and erratic styling behaviour

    Hello-

    It has been some time since I have worked on a site, but I have taken on a new job and created a site for it.

    http://joelgoodmanshow.us

    I created the site and then decided to change it. In the process I blew it up and deleted some HTML / CSS code that I didn't realize was needed, even after changing the site.

    I tried to recreate it, but to no avail.

    I am left with two interesting problems -

    (I created colored borders as a way to visualize what is where. They will be changed or eliminated after all is okay.

    This container
    <div id="lower-container"> .lower-container { position:relative; top:20px; margin-top:22px; width:800px; margin: 0 auto; height:100%; padding:0px 0px; padding-bottom:20px; background:#ffffff; border:3px solid red; } I would like to keep it Relative. Or would a simple solution be to list it as Absolute and end the positioning problem. I wanted to keep it fluid in the event that I changed one of the message boxes above it in the message container. and therefore it would adjust.

    This container here should have borders (which it did before I deleted the code) around it created by theCSS span list below: but, the styling seems to be applied to the container named "phrase"

    I've never seen that.
    <li> <a href="http://mountaincrafted.com"> <span class="below-list-contents-3"> <img src="http://quiltron.net/images/joel-goodman-show/advertisers/mountain-crafted_logo_310_150.jpg" alt="mountain crafted logo" /> </span> </a> </li> .span-list-3_1 a:hover { font-family: Arial, Helvetica, Geneva, Swiss, "SunSans Regular", "sans serif";
    position:relative;
    font-weight:900;
    top:-226px;
    left:-100px;
    margin-bottom:20px;
    width:285px;
    height:255px;
    background-repeat:no-repeat;
    background-image:url(http://quiltron.net/images/survival-...bang_275.gif);
    background-position: 0px 0px; /* first value = horizontal, second = vertical */
    z-index:5;
    }


    <div id="phrase"> We're developing the site. --- Please have patience. <br /> It should be worth the wait. </div> <!-- end --> Any suggestions would be appreciated. I will be looking at it this morning - to see if a fresh eye can help it. Dorian
Working...
X