Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Senior Member Tyler Smith's Avatar
    Join Date
    Oct 2011
    Posts
    115
    Member #
    29767
    Liked
    7 times
    Hello everyone,

    I am trying to piece together the side windows graphics using 3 .gif images. I have a start section .gif, a body section .gif (that is set to repeat-x), and a .gif that serves as the end.

    The code I have attempted to put these together is the following:
    Code:
    #leftside{
        overflow:auto;
        float:left;
        height:700px;
        width:300px;
    }
        #leftsidestart{
            float:right;
            background:url("sidewindowstartleft.gif") no-repeat scroll 50% 0 transparent;
            height:300px;
            width:25px;
        }
        #leftsidebody{
            margin:0 auto;
            background:url("sidewindowbody.gif") repeat-x scroll 50% 0 transparent;
            height:300px;
        }
        #leftsideend{
            float:left;
            background:url("sidewindowendleft.gif") no-repeat scroll 50% 0 transparent;
            height:300px;
            width:18px;
        }
    Still, for some reason, the images are scrunched and are not in the correct position.

    This is for my home page at Atlanta Review Group

  2.  

  3. #2
    Senior Member Ganners's Avatar
    Join Date
    Feb 2011
    Location
    United Kingdom
    Posts
    415
    Member #
    27007
    Liked
    92 times
    Well, you have you right and left side the wrong way round.

    Code:
    <div id="leftside">
        <div id="leftsideend">&nbsp;</div>
        <div id="leftsidebody">
          <h2 class="sideWindowHeaderText">Most Popular</h2>
          <ul class="sideWindowLinks">
            <li><a href="http://www.atlantareviewgroup.com/food/peapod1.html">Peapod</a></li>
            <li><a href="http://www.atlantareviewgroup.com/health/dieting/southbeach1.html">South Beach Diet</a></li>
            <li><a href="http://www.atlantareviewgroup.com/coupons/brandcaster1.html">Brandcaster Coupons</a></li>
          </ul>
        </div><!-- end left box div -->
        <div id="leftsidestart">&nbsp;</div>
      </div>
    So just flip those over, then make your leftsidebody float left.
    Tyler Smith likes this.
    Mark Gannaway Software Developer

    Recent Experiments
    - Backpropogation Neural Network language solving (http://ann.ganners.co.uk/)
    - Animated image to ASCII (http://google.ganners.co.uk/)
    - 3D Paper Characters (http://cybergame.ganners.co.uk/)
    - Anagram solving (http://roflol.co.uk/)

  4. #3
    Senior Member Tyler Smith's Avatar
    Join Date
    Oct 2011
    Posts
    115
    Member #
    29767
    Liked
    7 times
    Hi! You're awesome. That is all.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 07:39 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com