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.

Page 2 of 2 FirstFirst 1 2
Results 11 to 15 of 15

Thread: Giant divs

  1. #11
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Why did you wrap the sections twice? This is the code I have:

    HTML Code:
        <div id='top'>
            <div class='top-container' id='left'>
            </div>
            <div class='top-container' id='middle'>
            </div>
            <div class='top-container' id='right'>
            </div>
        </div>
    My problem with fixed widths is that the divs won't span across the page on all screen resolutions. I only want one div visible at a time. Sorry I didn't make it clear in the drawing.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  2.  

  3. #12
    Senior Member Ganners's Avatar
    Join Date
    Feb 2011
    Location
    United Kingdom
    Posts
    415
    Member #
    27007
    Liked
    92 times
    Wrap twice so you can move the inside container to navigate or whatever. Outside container should remain static. So you wan't 100% width divs?

    In that case do this:
    HTML Code:
    <div id="scroll" style="display: block; overflow: hidden;">
    <div id="scroll-container" style="width:300%; display: block;">
    <section id="section-1" style="width:33.33%; float: left; display: block;">Section 1</section>
    <section id="section-2" style="width:33.33%; float: left; display: block;">Section 2</section>
    <section id="section-3" style="width:33.33%; float: left; display: block;">Section 3</section>
    </div>
    </div>
    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. #13
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    yeah, that's basically what Webby said up there. I just need to add some margins.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  5. #14
    Senior Member Ganners's Avatar
    Join Date
    Feb 2011
    Location
    United Kingdom
    Posts
    415
    Member #
    27007
    Liked
    92 times
    Oh right, just do like:

    width:30%;
    margin: 0 3.33% 0 0;
    float: left;
    display: block;

    on each section or something.
    George Dolidze 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/)

  6. #15
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Quote Originally Posted by Ganners, post: 218640
    Oh right, just do like:

    width:30%;
    margin: 0 3.33% 0 0;
    float: left;
    display: block;

    on each section or something.
    That makes sense! I was trying 10% margins, then got really confused. I guess things have to be spelled out to me lol.
    Thanks for all the help guys!!
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.


Page 2 of 2 FirstFirst 1 2

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 05:47 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com