Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder cineweekly.com's Avatar
    Join Date
    Aug 2010
    Posts
    485
    Thanks
    14
    Thanked 3 Times in 3 Posts

    Question Should be a simple fix for this layout issue. Help Dr. V!

    I changed things from my last post and now the problem appears to be much simpler but I still don't know what I'm overlooking. It's pretty self explanatory of what's wrong and what I'm going for. The right panel is shifted down.
    www.cineweekly.com

    Here is the code in question:

    Code:
    (Left Column)
    #layoutLatest {
    	width: 150px;
    	position:absolute;
    	background-color: #FFFFFF;
    }
    .contentLatest {
    	font: 1em Arial, Helvetica, sans-serif;
    	padding:20px 0px 20px 10px;
    }
    
    (Middle Column)
    #layoutMain {
    	width: 670px;
    	padding: 7px 0px 0px 0px;
    	background: #FFFFFF url(images/borderFilm.png) repeat-y center;
    	background-position:left;
    	font: 1em Arial, Helvetica, sans-serif;
    	line-height: 1.7em;
    	text-align: justify;
    	display: block;
    	margin-left:150px;
    	position:relative;
    }
    .contentMain {
    	margin: 0px 32px 0px 32px;
    }
    
    (Right Column that needs fixed)
    #layoutSideBanner {
    	width: 150px;
    	background-color: #FFFFFF;
    	position:relative;
    }
    .contentSideBanner {
    	padding: 20px 0px 20px 0px;
    }
    Here is the html (Took out contents and replaced with "Content" for clarity):

    Code:
    <div id="layoutLatest">
    <div class="contentLatest">
    Content
    </div></div>
    
    <div id="layoutMain"> 
    <div class="contentMain">
    Content
    </div></div>
    
    <div id="layoutSideBanner"><div class="contentSideBanner">
    Content
    </div></div>
    
    <div id="footer">
    Content
    </div>
    Last edited by cineweekly.com; 09-01-2010 at 12:54 AM. Reason: Changed settings, same problem but simpler solution.

  • #2
    Regular Coder cineweekly.com's Avatar
    Join Date
    Aug 2010
    Posts
    485
    Thanks
    14
    Thanked 3 Times in 3 Posts
    I made all three columns float:left; and it appears to work. Is this the best solution?
    Last edited by cineweekly.com; 09-01-2010 at 12:58 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •