SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: Right Side

  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2006
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Right Side

    Could I get some help, I can't get the right side to push up.

    http://itssecured.com/commercial.php

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,368
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    The right column (24hr service guarantee) is as high as it can possible go in that structure.

    You have cleared the first list and image and started a new row so the float can go no higher than it presently is.

    If you started a new row because you wanted the image pushed down to match the list then you should have created a grid_12 for the left column so that effectively you have 2 columns and then you can split the left column into two more floated columns as required. That will allow the right column to start at the top of the page.

    e.g.

    Code:
    <div class="grid_12">
    		<div id="comcol" class="grid_6 alpha">
    				<ul>
    						<li>Electrical Panel Upgrades</li>
    						<li>Add plugs, switches or lights </li>
    						<li> Ceiling fan installation </li>
    						<li> Light bulb and ballast replacement </li>
    						<li>GFI outlets </li>
    						<li>Recess lighting </li>
    						<li>Landscape lighting </li>
    						<li>Security lighting </li>
    						<li> Parking lot lighting </li>
    						<li> Lighting Maintenance programs </li>
    						<li> Whole system surge protection </li>
    						<li> Dimmers </li>
    						<li> Time switches for lighting </li>
    						<li> Dedicated computer outlets </li>
    				</ul>
    		</div>
    		<div id="comcol2" class="grid_6 omega"><img src="http://itssecured.com/img/pepsi.jpg" width="205" height="189"/></div>
    		<div style="clear:both"></div>
    		<div class="grid_6 alpha">
    				<ul>
    						<li>Electrical Panel Upgrades</li>
    						<li>Add plugs, switches or lights </li>
    						<li> Ceiling fan installation </li>
    						<li> Light bulb and ballast replacement </li>
    						<li>GFI outlets </li>
    						<li>Recess lighting </li>
    						<li>Landscape lighting </li>
    						<li>Security lighting </li>
    						<li> Parking lot lighting </li>
    						<li> Lighting Maintenance programs </li>
    						<li> Whole system surge protection </li>
    						<li> Dimmers </li>
    						<li> Time switches for lighting </li>
    						<li> Dedicated computer outlets </li>
    				</ul>
    		</div>
    		<div class="grid_6 omega"><img src="http://itssecured.com/img/pepsi.jpg" width="205" height="189"/></div>
    </div>
    <!-- end grid12 -->
    <div class="grid_4">
    etc....
    Don't forget the alpha and omega classes on nested grds otherwise you get extr amargins and columns will drop.

    These grid are really more work than normal CSS but if you use them you must stick to their philosophy.


Bookmarks

Posting Permissions

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