Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    body {width: xxx}

    Hello. I'm a noob and aplogise for it.

    I want to specify that my html body text only fills a certain width. That is, to override the default of have the browser decide my line width.

    Reading a few O'Reilly books, I had thought that the following would work, but it doesn't. I'd be very grateful of any advice. I'm using IE 6.0 to view.

    <style type="text/css">
    body { width : 10cm }
    </style>

    If something like this has been answered before, please point me to the post. I tried searching and failed to find it.

    Thanks,
    Tolstoy.

  • #2
    Regular Coder
    Join Date
    May 2004
    Location
    Minneapolis, MN, USA
    Posts
    904
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Centimeters should be used for print, if anything. Measurements like that have no real meaning when your canvas' base unit is a pixel, whose size is relative to the monitor resolution.

    If you use something like pixels, percentages or em units, what you're attempting should work fine.

  • #3
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    the post before this is correct u really dont want to use cm for a measure like what u want, since a screen resolution is in pixels, u can try using percentages or pixels, however if u want to use cm try this instead
    Code:
    <style type="text/css">
    body { width : 10cm;overflow:auto;} 
    </style>

  • #4
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Many thanks to you both for your help.

    I tried putting the units into px but it didn't work. I then tried specifying
    p {width: 500px}
    and it works just fine. I had expected the body to feed down to the p, but it doesn't. If that can't be fixed, at least I have a workaround.

    Thanks again. It's appreciated,
    Tolstoy

  • #5
    Jan
    Jan is offline
    Regular Coder
    Join Date
    Jul 2002
    Location
    Finland
    Posts
    204
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Another way would be to put the text inside a container, and apply the width to it:

    Code:
    #container {
      width: 500px;
      }
    and

    Code:
    <div id="container">
      <p>Text comes here.</p>
    </div>
    Just a suggestion

  • #6
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

  • #7
    Jan
    Jan is offline
    Regular Coder
    Join Date
    Jul 2002
    Location
    Finland
    Posts
    204
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Tolstoy
    The article you are referring to only states that IE6 has some issues when applying width: 100% to the body. The example I posted earlier is just one of several methods that should work just fine.

  • #8
    New to the CF scene
    Join Date
    Jan 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes, using your suggestion fixes my width problem for me. Thanks
    Specifying width to body in any units (not just %) doesn't seem to work.

    Whilst the code you kindly provided works perfectly, I'm having other problems. In particular, I'm not getting :before to do what I expect it to.

    h1.author:before {content : "Author: "}

    I've tried copy-typing textbook examples, but I'm having no fun.

    I really appreciate your answering noob questions like this. You've already saved me half a day.

    Ta,
    Tol

  • #9
    Jan
    Jan is offline
    Regular Coder
    Join Date
    Jul 2002
    Location
    Finland
    Posts
    204
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm glad I can help! Concerning you're other problem, I'm not quite sure what you're trying to accomplish. I can however recommend you to take a look at W3Schools and the CSS2 reference provided there. Hope this helps.
    Last edited by Jan; 01-21-2005 at 12:03 PM.


  •  

    Posting Permissions

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