Web Analytics Made Easy - StatCounter Massive alignment problems - CodingForum

Announcement

Collapse
No announcement yet.

Massive alignment problems

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    Massive alignment problems

    REF:http://chieftainclothing.com/mockup/

    1. I can't seem to get the wrapper to cover the entire content area. I don't want to hard code a page height. I added the border for editing.
    2. I can't get the footer below the content.
    3. I can't resolve the single error that the validator finds, when I try to correct it I introduce 26 more errors?

    I used to know how to do much of this stuff, but suddenly nothing seems to work.

    Suggestions?
    Tags: None
  • #2
    What about this?


    CSS
    Code:
    body {
    background: url("bg.gif") repeat scroll 0 0 transparent;
    height: 100%;
}

#golfer {
	float: left;
	margin-left: 25px;
}
#logo {
	float: right;
}
#aside {
	margin-top: 50px;
	margin-left: 200px;
}
#wrapper {
	width: 960px;
	margin: 0 auto;
	background-color: white;
	border: 12px solid #600;
	overflow:auto;
}

    html
    Code:
    <body>
    <div id="outside">
      <div id="wrapper">
        <div id="golfer"><img src="golfer.png" width="123" height="273" /></div>
        <div id="logo"><img src="header.jpg" width="622" height="82" /></div>
        <div id="aside">
          <div id="nav">
            <ul>
              <li><a href="index.html" target="_blank" title="Chieftain Clothimg Home" ></a>Home</li>
              <li><a href="inspiration.html" title="Chieftain Clothing Inspiration page" target="_blank"></a>Inspiration</li>
              <li><a href="shop.html" title="Chieftain Clothing Shop page" target="_blank"></a>Shop</li>
              <li><a href="contact.html" title="Chieftain Clothimg contact page" target="_blank"></a>Contact</li>
              <li><a href="team.html" title="Chieftain Clothimg Team page" target="_blank"></a>Out Team</li>
              <li><a href="http://chieftainclothing.com/blog" title="Chieftain Clothimg Blog page" target="_blank"></a>Blog</li>
            </ul>
          </div>
        </div>
      </div>
      <!--close wrapper--> 
    </div>
    <!--close outside-->

    <div id="footer">&copy; chieftain clothing LLC | all rights reserved</div>
</body>

    and btw, you can take that <ul> and specify the lists to use the arrow.png instead of the bullets. Then you dont have to add those images in your code.

    #aside #nav ul li {
    list-style-image: url(arrow.png);
    }
    Last edited by teedoff; Aug 25, 2011, 02:07 PM.
    Teed

    Comment

    • #3
      give overflow:auto to container and try

      Comment

      • #4
        Originally posted by vikram1vicky View Post
        give overflow:auto to container and try
        lol to late! I already did that in my sample code for him...lol

        His code was almost correct, but still trying to use positioning along with floats.
        Teed

        Comment

        • #5
          Its ok dear.. main purpose to solves someone's probs.. u solved or me or our other buddies... its same

          Comment

          Previous template Next
          Working...
          X
          😀
          🥰
          🤢
          😎
          😡
          👍
          👎