Thread: CSS Positioning

    #1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2002
    Posts
    6
    Rep Power
    0

    CSS Positioning


    I'm new to the concept of a website not using tables and I'm trying to develop one without them but I've run into what I'm sure is a relatively simple snag.


    Here's a block of code and an image of it.

    Code:
    <div id="Footer">
    
    	<img src="images/img_equalhousing.jpg" alt="">
    
    	<div id="FooterLinks">
    
    		<a href="Licensing.aspx" title="Licensing Disclosure">Licensing Disclsoure</a>&nbsp;|&nbsp;
    		<a href="Privacy.aspx" title="Privacy Policy">Privacy Policy</a>&nbsp;|&nbsp;		
    		<a href="Disclosure.aspx" title="Disclosure">Disclosure</a>
    		<br />
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a>&nbsp;|&nbsp;	
    		<a href="FastLane.aspx" title="In The FastLane">In The Fastlane</a>&nbsp;|&nbsp;	
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a>&nbsp;|&nbsp;	
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a>
    
    	</div>
    </div>
    and the accompanying CSS

    Code:
    #Footer 
    {
    	bottom:auto;
    	margin:10px 0px 10px 0px;
    	padding:5px 0px 5px 20px;
    	border-style:solid;
    	border-color:black;
    	border-width:1px 0px; 
    	line-height:11px;
    	background-color:#eee;
    	voice-family: "\"}\"";
    	voice-family:inherit;
    	height:auto;
    }
    
    #Footer #FooterLinks 
    {
    	font:10px;
    	position:relative;
    	text-align:center;
    	line-height:20px;
    	z-index:1;
    	clear:both;
    }

    and the results


    What I need however is the image CENTERED vertically where it is at the left end with the links as they are. How can I center the image and keep the image and the links all in the same row?

    Thanks
    Last edited by MastaM00; November 3rd, 2003 at 07:21 PM.
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    city of sin, state of the art
    Posts
    421
    Rep Power
    0
    like this....?

    Code:
    <head>
    
    <style>
    
    #Footer 
    {
    	bottom:auto;
    	margin:10px 0px 10px 0px;
    	padding:5px 0px 5px 20px;
    	border-style:solid;
    	border-color:black;
    	border-width:1px 0px; 
    	line-height:11px;
    	background-color:#eee;
    	voice-family: "\"}\"";
    	voice-family:inherit;
    	height:auto;
    	valign: middle;
    }
    
    #Footer #FooterLinks 
    {
    	font:10px;
    	position:relative;
    	text-align:center;
    	line-height:20px;
    	z-index:1;
    	clear:both;
    }
    
    </style>
    
    
    </head>
    
    
    <body>
    
    <div id="Footer">
    
    
    <table width=100%>
    <tr><td width="50">
    	<img src="images/img_equalhousing.jpg" alt="" valign=middle>
    </td>
    <td>
    
    	<div id="FooterLinks">
    
    		<a href="Licensing.aspx" title="Licensing Disclosure">Licensing Disclsoure</a> | 
    		<a href="Privacy.aspx" title="Privacy Policy">Privacy Policy</a> | 		
    		<a href="Disclosure.aspx" title="Disclosure">Disclosure</a>
    		<br />
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a> | 	
    		<a href="FastLane.aspx" title="In The FastLane">In The Fastlane</a> | 	
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a> | 	
    		<a href="Flexible.aspx" title="We're Flexible">We're Flexible</a>
    
    	</div>
    
    </td></tr>
    </table>
    </div>
    </body>
    good lucky!!

IMN logo majestic logo threadwatch logo seochat tools logo