WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Footer text align left with an image aligned right (3 posts)

  1. kyleinwuhan
    Member
    Posted 6 years ago #

    Hello,

    I am looking to add an image to my footer. My footer information is aligned to the left and I would like my image to be aligned to the right side. Should I set up some sort of table? I've included the following information and pictures to give everyone a better idea of what I'm wanting.

    This is what I have:

    http://www.flickr.com/photos/kyleinwuhan/2574742051/

    Image to add:

    http://www.flickr.com/photos/kyleinwuhan/2575568108/

    This is what I want:

    http://www.flickr.com/photos/kyleinwuhan/2574742145/

    Thank you for any guidance and help provided. I'll continue to search around the forums to find an answer. If I do, I'll be sure to close this thread.

    GB

    Kyle
    My footer.php

    <hr class="low" />
    
    <!-- footer ................................. -->
    <div id="footer">
    
    	<p>© <?php echo date("Y")." "; ?> - Kyle A. Meyers. All rights reserved.<br /><a href="http://www.kylemeyers.org/policy/">Terms of Use</a><br />
        <a href="<?php bloginfo('siteurl');?>/wp-admin/" title="Login to Admin">Site Admin</a> or <?php wp_loginout(); ?></p>
    	</div> <!-- /footer -->
    
    </div> <!-- /container -->
    <?php wp_footer(); ?>
    </body>
    
    </html>

    Footer .css

    #footer {
      color:#141011;
      background:white url(images/spring_flavour/footer_bg.gif) 470px 0px no-repeat;
    }
    
    .singlecol #footer {background-image:none;}
    
    #footer p {border-top:6px solid #FAFAFA;}
    
    #footer a {color:#000000;}
    
    #footer a:hover {color:#000000;}
    
    #footer strong {color:#000000;}
    
    div.img-dec {
    	background: url('http://www.kylemeyers.org//wp-content/themes/blixed/images/spring_flavour/dropshadows/shadow.gif') no-repeat bottom right;
    	clear: left;
    	float: left;
    	margin: 0 0 15px 25px;
    	padding: 0;
    	position: relative;
    }
    
    div.img-dec img {
    	background-color: #fff;
    	border: 1px solid #a9a9a9;
    	display: block;
    	margin: -5px 5px 5px -5px;
    	padding: 5px;
    	position: relative;
    }
    div.img-ilus {
    	background: url('http://www.kylemeyers.org//wp-content/themes/blixed/images/spring_flavour/dropshadows/shadow.gif') no-repeat bottom right;
    	margin: 10px 5px;
    	padding: 0;
    	position: relative;
    }
    
    div.img-ilus img {
    	background-color: #fff;
    	border: 1px solid #a9a9a9;
    	margin: -5px 5px 5px -5px;
    	padding: 4px;
    	position: relative;
    	vertical-align: bottom;
    }
    
    ul {
    list-style: none;
    }
    
    .bordered {
     padding: 2px;
     border: solid black 2px;
     /** uncomment for debugging **/
     color: black;
     background-color: red;
     }
    /* footer
    --------------------------------------------------*/
    #footer {
      clear:both;
      padding:40px 0 15px 0;
      font-size:0.95em;
    }
    
    .singlecol #footer {
      padding:25px 0 15px 0;
    }
    
    #footer p {
      padding:12px 0 18px 0;
      border-top:1px solid;
    }
    
    #footer strong {font-weight:normal;}
    
    .singlecol #footer p {
      padding:12px 70px 18px 70px;
    }
  2. jessn
    Member
    Posted 6 years ago #

    <div id="footer">
    <img src="image.jpg" style="float: right;">
    	<p>© <?php echo date("Y")." "; ?> - Kyle A. Meyers. All rights reserved.<br /><a href="http://www.kylemeyers.org/policy/">Terms of Use</a><br />
        <a href="<?php bloginfo('siteurl');?>/wp-admin/" title="Login to Admin">Site Admin</a> or <?php wp_loginout(); ?></p>
    	</div> <!-- /footer -->
  3. kyleinwuhan
    Member
    Posted 6 years ago #

    Thanks! It worked great. Your help is greatly appreciated.

    GB

    Kyle

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.