SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: Width problem

  1. #1
    SitePoint Member
    Join Date
    Feb 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Width problem

    I can't get the text to stay within the set area (white). Some tables become very wide and I get a horizontal scrollbar that I don't want. How do I fix this?

    The problem is clearly visble here
    http://stormvarning2.nordharna.se/mh.php

    Code:
    * {
    	margin: 0;
    	padding: 0
    }
    body {
    	padding: 0;
    	background-image: url(bgr.gif);
    	background-color: #000000;
    	font: 12px "Lucida Sans Unicode", Verdana, sans-serif;
    	color: #202020;
    	text-align: left;
    	margin-top: 20px;
    	margin-bottom: 20px;
    }
    #contentbody {
    	margin: 0px auto !important;
    	width: 800px;
    	background: url(contentbody.gif) repeat-y;
    }
    #headerStormvarning 
    {
      padding-top: 0px;
    	background-image: url(header.jpg);
    	background-repeat: no-repeat;
    	height: 276px;
    	text-align: center;
    }
    #menu
    {
      padding-top: 230px;
      color: #FFFFFF;
      text-align: left;
      padding-left: 20px;
    }
    #related {
    	float: right;
    	width: 200px;
    	padding-right: 30px;
    }
    #contentStormvarning {
    	float: left;
    	margin: 10px;
    	padding: 0px 5px 0px 5px;
    	text-align: left;
    }
    #contentStormvarning p, h1, h2, h4, h3, table,td,tr,.post-title {
    	width: 490px;
    	text-align: left;
    	margin: 0px 0px 5px 20px;
    	padding: 3px;
    	font-size: 12px;
    }
    
    #footerStormvarning {
    	background-image: url(footer.gif);
    	background-repeat: no-repeat;
    	height: 80px;
    	clear: both;
    }
    #footerStormvarning p {
    	text-align: center;
    	padding: 35px;
    	font: 10px "Lucida Sans Unicode", Verdana, sans-serif;
    	color: #101010;
    }
    Code:
    <body> 
        <div id="contentbody">
          <div id="headerStormvarning">
            <div id="menu">
                  <a href="http://stormvarning2.nordharna.se/index.php">Hem</a>         </div>
    
          </div>
          <div id="related">
            <h4>L&auml;nkar</h4>
        <a href="floprym_stormvarning.php">Om Ludde<br></a><br>        </div>
          <div id="contentStormvarning">
            <h1>Mentalbeskrivning 2006-04-22</h1>
    
    <p> I str&aring;lande sol &aring;kte vi till Alings&aring;s d&auml;r Per-Arne Jadepalm mentalbeskrev Ludde. Tusen tack f&ouml;r skjutsen L&aring;tta!
    </p>
    <p> Bilder finns i
      <a target="_blank" href="http://gallery.nordharna.se/060422/">galleriet</a>. Siffrorna inom parentes anger snittet f&ouml;r rasen f&ouml;r 2005
    </p>
    <p> Stort sett gick det som jag trodde. Han &auml;r lite r&auml;dd ibland, men han tycker alltid om att tr&auml;ffa nya m&auml;nniskor (om de inte har vita lakan p&aring; sig).
    
    </p>
    
    
            <table class="mhtable">
              <tr>
                <td >
                  
                    <strong style="font-weight: 400">  10. SKOTT</strong> 
                    <br> (2) 
                  </td>
    
                <td  class="marked">
                   Visar ingen ber&ouml;rdhet. Snabb kontroll och sedan helt ober&ouml;rd. 
                  </td>
                <td  >
                   Avtagande kontroller under lek/passivitet. D&auml;refter ober&ouml;rd. 
                  </td>
                <td >
                   Riktar intresse mot skytten, publiken eller annat, men &aring;terg&aring;r till lek/passivitet. 
                  </td>
    
                <td  >
                   Avbryter lek eller passivitet. L&aring;ser sig mot publiken, skytten eller annat. &Aring;terg&aring;r inte till lek/passivitet. 
                  </td>
                <td  >
                   Ber&ouml;rd, r&auml;dd. Alt. vill l&auml;mna platsen, f&ouml;rs&ouml;ker fly. Alt. f&ouml;rare avst&aring;r skott. 
                  </td>
    
              </tr>
              <tr>
                <td colspan="6" class="mhcomment">
                  
                    <b> Kommentar: Jag trodde inte han skulle f&aring; en etta                            h&auml;r eftersom vi haft skottr&auml;ning p&aring; apporteringen och d&aring; h&auml;nder det                            ju ofta n&aring;got en bit bort som han m&aring;ste ha koll p&aring;. Han &auml;r i vilket                            fall inte det minsta r&auml;dd utan kollar bara in vad som h&auml;nder. Under rassnittet.</b></td>
    
              </tr>
            </table>
    
      
          </div>
          <div id="footerStormvarning">
            <p>Copyright 2007 Elsa Nordh <a href="mailto:elsa@nordharna.se">elsa@nordharna.se</a><br>
    Inspirerad av <a href="http://www.gilbertson.nu">&Aring;sa Gilbertson</a>
    
    </p>
          </div>
        </div>

  2. #2
    SitePoint Member
    Join Date
    Feb 2007
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I got help on an other forum. The solution was as simple as remove the width from

    Code:
    #contentStormvarning p, h1, h2, h4, h3, table,td,tr,.post-title {
    	width: 490px;
    	text-align: left;
    	margin: 0px 0px 5px 20px;
    	padding: 3px;
    	font-size: 12px;
    }


Bookmarks

Posting Permissions

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