View Single Post
  #1 (permalink)  
Old Jul 31st, 2006, 23:04
eksquall eksquall is offline
New Member
Join Date: Jul 2006
Location: sydney
Age: 23
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
container overlaps upon text resize in Firefox

hey guys , i decided to use px for my text size so that it doesnt get resized, however it doesnt get resized in IE only , in Firefox it does get resized when u try to increase/decrease the text size.

But the problem is that when u make the text really big , it goes out of the container its supposed to be in while in Firefox. Also sometimes on IE the same thing happens without resizing the text size and i have to refresh the page to make it go normal. Any way to make it so the #content container doesnt overlap upon resize or any other situation?

please try resizing the text in Firefox and in IE ,from the default page goto roster and back again to News page , u will see that the container is out of place. (the #content div has a red border)

http://t-ek.awardspace.com


my css code:

Code: Select all
body  {background-image:url(images/bg.gif) } 




#maincontainer   { 
      position:absolute; 
      top:0px; 
      left:0px; 
      margin-left:13%; 
      width:780px; 
      border:solid; 
      border-color:green; 
      border-width:0px; 
      height:600px; 
      background-color:#757575; 
      } 
       
#borderleft      { 

      border:solid; 
      border-color:white; 
      border-width:0px; 
      width:16px; 
      background-image:url(images/leftborder.jpg); 
      background-repeat:repeat-y; 
      background-position:left; 
      height:100%; 
       
            } 
             
#bartop    { 
      position:absolute; 
      top:0px; 
      border:solid; 
      border-color:blue; 
      border-width:0px; 
      width:748px; 
      margin-left:16px; 
      height:24px; 
       
       
      } 

#borderright      { 
      position:absolute; 
      border:solid; 
      border-color:white; 
      border-width:0px; 
      width:16px; 
      background-image:url(images/rightborder.jpg); 
      background-repeat:repeat-y; 
      background-position:right; 
      height:100%; 
      top:0px; 
      right:0px; 
       
            } 
             
#logo img    { 
      width:748px; 
      height:152px; 
       
      } 


#logo      { 
       
      position:absolute; 
      top:24px; 
      left:16px; 
      border:solid; 
      border-color:red; 
      border-width:0px; 
      width:748px; 
      margin-top:-3px; 
       
      } 
       
#nav       { 
      position:absolute; 
      top:176px; 
      left:16px; 
      border:solid; 
      border-color:yellow; 
      border-width:0px; 
      height:25px; 
      width:748px; 
      margin-top:-2px; 
      padding-left:1px; 
      } 


#filler1      { 
      position:absolute; 
      left:0px; 
      width:3px; 
      height:25px; 
      display:inline; 
      border:solid; 
      border-color:red; 
      border-width:0px; 
       
      } 


#news      { 
      position:absolute; 
      left:3px; 
      width:93px; 
      height:25px; 
      display:inline; 
       
      } 

#roster      { 
      position:absolute; 
      left:96px; 
      width:78px; 
      height:25px; 
      display:inline; 
    
      } 


#servers      { 
      position:absolute; 
      width:82px; 
      height:25px; 
      display:inline; 
      left:174px; 
      } 

#cs      { 
      position:absolute; 
      width:237px; 
      height:25px; 
      display:inline; 
      left:256px; 
      } 


#matches   { 
      position:absolute; 
      width:80px; 
      height:25px; 
      display:inline; 
      left:493px; 
      } 

#files      { 
      position:absolute; 
      width:76px; 
      height:25px; 
      display:inline; 
      left:573px; 
      border:solid; 
      border-color:red; 
      border-width:0px; 
      } 
       
#links      { 
      position:absolute; 
      width:95px; 
      height:25px; 
      border:solid; 
      border-color:red; 
      border-width:0px; 
      left:649px; 
      display:inline; 
      }       

#barbottom   { 
      position:absolute; 
      left:16px; 
      top:200px; 
      width:748px; 
      border:solid; 
      border-color:red; 
      border-width:0px; 
    
      } 
       
#mcontent      { 
       
      position:absolute; 
      top:216px; 
      bottom:33px; 
      left:16px; 
      width:748px; 
      border:solid; 
      border-color:blue; 
      border-width:0px; 
      background-color:#757575; 

       
      } 
#content         { 
       
      padding-top:10px; 
      position:absolute; 
      bottom:0px; 
      top:0px; 
      border:solid; 
      border-color:red; 
      border-width:1px; 
      width:748px; 
     
       
       
      }    

#barlast   { 
      position:absolute; 
      left:16px; 
      bottom:0px; 
      width:748px; 
       
       
      }    


.textmain   { 
      font-family:Arial,Verdana,"Arial Black","Helvetica Bold",sans-serif; 
      font-weight:bold; 
      font-size:12px; 
      color:white; 
      white-space:pre; 
      text-align:justify; 
      word-spacing:1px; 
      } 
       

       

a:link {border-width:0px}
Reply With Quote