need Help from Someone good with CSS

[Matt_dowd91]

*****

how to remove grey border and make the site stretch to fit a mobile phone screen?i cant continue with the site until i fix it it just doesnt suit mobiles

[icedroplet1987]

post your css body, and also check it bg tag is used in index..

keep margin, padding, width, hight auto or keep it fixed!! i am also interested to see experts comment about mobile screen fix!!

[Matt_dowd91]

/* FORUM STYLE */
body {

 height:100%;
 width: 480px;
 margin: auto;
 padding:0;
background-color: #4E4E4E;
 } 

Heres the body i havent studied css much thats why im stuck lol

[icedroplet1987]

/* FORUM STYLE */
body {

 height:100%;
 width: 480px;
 margin: auto;
 padding:0;
background-color: #4E4E4E;
 }

Heres the body i havent studied css much thats why im stuck lol

body {

 height:100%;
 width: 480px;
 margin: auto;
 padding:0;
background-color: change this with any colour you want or to remove, just remove this line;
 }

[metulj]

i'd also suggest to replace line

width; 480px;

with

max-width: 98%;

that would be also partly answer to icedroplet1987 i guess..

[Matt_dowd91]

body {

 height:100%;
 width: 480px;
 margin: auto;
 padding:0;
background-color: change this with any colour you want or to remove, just remove this line;
 }

this is rest off

    text-align: center;            /* make sure IE centers the page too */
}

#wrapper {
    width: 450px;
    margin:0 auto;             /* center page */
}

#content {
    background-color: #fff;
    border: 1px solid #000;
    float: left;
    font-family: Arial;
    padding: 20px 30px;
    text-align: left;
    width: 100%;                /* fill up the entire div */
}

#menu {
float: left;
border: 1px solid #000;
border-bottom: none;        /* avoid a double border */
clear: both;                /* clear:both makes sure the content div doesn't float next to this one but stays under it */
width:100%;
height:20px;
padding: 0 30px;
background-color: #FFF;
text-align: left;
font-size: 85%;
}

#menu a:hover {
    background-color: #009FC1;
}

#userbar {
    background-color: #fff;
    float: right;
    width: 250px;
}

#footer {
    clear: both;
}

/* begin table styles */
table {
    border-collapse: collapse;
    width: 100%;
}

table a {
    color: #000;
}

table a:hover {
    color:#373737;
    text-decoration: none;
}

th {
    background-color: #B40E1F;
    color: #F0F0F0;
}

td {
padding: 5px;    
}

/* Begin font styles */
h1, #footer {
    font-family: Arial;
    color: #F1F3F1;
}

h3 {margin: 0 ; padding: 0px;}

/* Menu styles */
.item {
    background-color: #00728B;
    border: 1px solid #032472;
    color: #FFF;
    font-family: Arial;
    padding: 3px;
    text-decoration: none;
}

.leftpart {
    width: 70%;
}

.rightpart {
    width: 30%;
}

.small {
    font-size: 75%;
    color: #373737;
}
#footer {
    font-size: 65%;
    padding: 3px 0 0 0;
}

.topic-post {
    height: 100px;
    overflow: auto;
}

.post-content {
    padding: 30px;
}

textarea {
    width: 450px;
    height: 200px;
} 

[just_m3.]

Thanks bro , screen width i will figureout myself i got too much code in my file lol

No one will give you ready made css :D to fit on your site , some advices remove that strict <width's/heights> and modify your script pages to fit on your needs .
you can't set it just from css .. html (static page) need's to be modified also :p .

[Matt_dowd91]

thanks guys also padding 0px; can fix toomuch white space it looks good now on mobile