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 10 of 10

Thread: CSS sizing

  1. #1
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    Here is the code i have

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>	<style type="text/css">
    #container {
    border:1px solid #000000;
    width: 500px;
    \width: 500px;
    w\idth: 500px;
    margin: 10px;
    margin-left: auto;
    margin-right: auto;
    padding: 2.5px;
    }
    
    #banner {
    border:1px solid #000000;
    padding: 5px;
    margin-bottom: 5px;
    background-color: white;
    }
    
    #content {
    
    border:1px solid #000000;
    padding: 5px;
    margin-left: 215px;
    margin-right: 215px;
    background-color: white;
    }
    
    #sidebar-a {
    border:1px solid #000000;
    float: left;
    width: 100px;
    \width: 100px;
    w\idth: 100px;
    margin: 0;
    margin-right: 5px;
    padding: 5px;
    background-color: white;
    }
    
    #sidebar-b {
    border:1px solid #000000;
    float: right;
    width: 100px;
    \width: 100px;
    w\idth: 100px;
    margin: 0;
    margin-left: 5px;
    padding: 5px;
    background-color: white;
    }
    
    #footer {
    border:1px solid #000000;
    clear: both;
    padding: 5px;
    margin-top: 5px;
    background-color: white;
    }
    </style>
    </head>
    <body>
    <div id="container">
    <div id="banner">&nbsp;</div>
    <div id="sidebar-a">&nbsp;</div>
    <div id="sidebar-b">&nbsp;</div>
    <div id="content">&nbsp;</div>
    <div id="footer">&nbsp;</div>
    </div>
    </body>
    </html>
    How can i expand that middle column so it comes with in 2.5 pixels of the side margins,

    also how can i make everything taller so it is more of a website not just boxes? can someone edit the code and SHOW me. Im actually understanding this after a week

  2.  

  3. #2
    Senior Member Fallout's Avatar
    Join Date
    Aug 2003
    Location
    Richmond, Virginia
    Posts
    543
    Member #
    2748
    Do you mean making the container 100% wide and then having 2.5 px padding on the body?

  4. #3
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    well i want the container to be taller, i also want the columns to be the same heigth as the container but with a 2.5 padding, any ideas

  5. #4
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    :lick: well i want the container to be taller, i also want the columns to be the same heigth as the container but with a 2.5 padding, any ideas

    EDIT:NOOO THE INFAMOUS DOUBLE POST
    EDIT2: i also want the column for the content to be wider, any idea how

  6. #5
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    ANYONE KNOW HOW TO RESIZE THIS STUFF, look at the post above

  7. #6
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    Well a pixel is the smallest unit on your screen.. Your monitor (or video card) cannot draw a half pixel.

    So try 2px or 3px.

    Edit: I have not tested it, but using 2.5 could be messing up the rendering?
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL

  8. #7
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    No that wasnt my question?? look at the top post i need help making the boxes taller and the content column bigger, the 2.5 works fine

    EDIT: i want the content to go out wider in otherwords, i also want to know how i can make all the columns taller so it doesnt just look like a small page

  9. #8
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    Oh I see...

    Well just decrease the margin-left and margin-right of the content div..

    The margins are how far apart the sides of the content are from the container.. so decreasing them will make the sides of the content closer to the edges.. making the content wider...

    making both margin-left and margin-right 50 pixels less... with give you a 100px more total to your width.. etc..
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL

  10. #9
    Senior Member ChrisTheCracka's Avatar
    Join Date
    May 2004
    Location
    Bellevue, WA
    Posts
    114
    Member #
    6036
    what about height

  11. #10
    Senior Member Aleister's Avatar
    Join Date
    Jul 2003
    Location
    Texas
    Posts
    250
    Member #
    2329
    Well there are no heights currently defined. If you want to set one for the content div you can..

    If you are wanting to get all 3 columns the same height (something that CSS does not always do very well by itself) there are different ways to accomplish it.. I would search on google for that.

    Otherwise, the columns will expand as needed (meaning the more content in them the longer they get)
    The Temple of Dagon | Dagon Design
    "That is not dead which can eternal lie, And with strange aeons even death may die." - HPL


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