Results 1 to 7 of 7
  1. #1
    Join Date
    Aug 2010
    Location
    CPU
    Posts
    2,187

    <DIV> Auto-Resize and Move to the next line

    I have 4-divs

    --------
    [1] [2]
    [3] [4]
    --------

    What I want is to resize each <div> to 300px whenever I use them on smartphones and they will re-arrange automatically this way.

    ----
    [1]
    [2]
    [3]
    [4]
    ----

    I was able to do to the auto-resize using "%" but I cannot limit to 300px and it doesn't go to the next line.

    I can't find an accurate solution using Google.

    I appreciate any help. Thanks
    Ask for Server IP & Nameservers IP to check if your reseller provider truly provides 100% white-label.

  2. #2
    Join Date
    Aug 2010
    Location
    CPU
    Posts
    2,187
    I hope someone can help me thanks
    Ask for Server IP & Nameservers IP to check if your reseller provider truly provides 100% white-label.

  3. #3
    Join Date
    Jul 2011
    Location
    Jordan, Amman
    Posts
    82
    classname {
    max-width: 300px;
    }

  4. #4
    Join Date
    Aug 2010
    Location
    CPU
    Posts
    2,187
    Thanks ahostprovider, will try this later.
    Ask for Server IP & Nameservers IP to check if your reseller provider truly provides 100% white-label.

  5. #5
    Join Date
    Sep 2008
    Location
    Melbourne
    Posts
    405

  6. #6
    Join Date
    Aug 2010
    Location
    CPU
    Posts
    2,187
    I think the command is min-width...



    HTML Code:
    <html>
    <body>
    
    <style>
    
    #boxes { float:left;
        min-width: 300px;
        border:1px solid green;
        padding:10px;
        margin-left:10px;
        margin-bottom:10px; }
    
    </style>
    
    
    <div id="boxes">
    Box1
    </div>
    
    <div id="boxes">
    Box2
    </div>
    
    <div id="boxes" style="clear:both;">
    Box3
    </div>
    
    <div id="boxes">
    Box4
    </div>
    
    </body>
    </html>
    Ask for Server IP & Nameservers IP to check if your reseller provider truly provides 100% white-label.

  7. #7
    Join Date
    Jul 2011
    Location
    Jordan, Amman
    Posts
    82
    Quote Originally Posted by Yujin View Post
    I think the command is min-width...



    HTML Code:
    <html>
    <body>
    
    <style>
    
    #boxes { float:left;
        min-width: 300px;
        border:1px solid green;
        padding:10px;
        margin-left:10px;
        margin-bottom:10px; }
    
    </style>
    
    
    <div id="boxes">
    Box1
    </div>
    
    <div id="boxes">
    Box2
    </div>
    
    <div id="boxes" style="clear:both;">
    Box3
    </div>
    
    <div id="boxes">
    Box4
    </div>
    
    </body>
    </html>
    You want to limit it to 300px so min-width, will make the width at least 300px, not at most 300px.

Similar Threads

  1. Replies: 9
    Last Post: 01-16-2012, 05:07 AM
  2. 3 Column DIV Layout, Outer DIVs auto expand with bg image
    By jrandall in forum Web Design and Content
    Replies: 1
    Last Post: 02-27-2010, 03:13 PM
  3. Image Hosting/Storage Provider (Auto Resize Feature)
    By Syphic in forum Web Site Reviews
    Replies: 8
    Last Post: 10-23-2005, 10:55 PM
  4. Auto resize
    By Red Star Network in forum Web Design and Content
    Replies: 2
    Last Post: 09-08-2005, 01:44 AM
  5. how 2 auto resize iframe ?
    By zumaidi in forum Programming Discussion
    Replies: 4
    Last Post: 11-07-2002, 01:13 AM

Posting Permissions

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