Just need quick help please

Hello, im trying to get the "content-main" and "content-right" to be at 100% width, but for some reason when i have them equal to 100% the right bar goes down a line??

body {
        background-color:#000000;
        font-family:arial,helvetica,sans-serif;
        font-size:12px;
    }
    
    #wrapper {
        width:80%;
        margin:0px auto;
        padding:10px;
    }
    
    #header {
        background-color:#FFFFFF;
        border:2.5px solid #C4C4C4;
        width:100%;
        height:120px;
        padding:10px;
    }
    #navmenu{
        background-color:#FFFFFF;
        border:2.5px solid #C4C4C4;
        width:100%;
        height:20px;
        padding:10px;
    }
    #content {
        width:100%;
        background-color:#FFFFFF;

    }
    #content div {
        background-color:#FFFFFF;
        padding:10px;
        border:2.5px solid #C4C4C4;
        float:left;
    }

    #content-main {
        background-color:#FFFFFF;
        width:75%;
    }
    #content-right {
        background-color:#FFFFFF;
        width:25%;
    }
    #footer {
        background-color:#FFFFFF;
        float:left;
        margin-bottom:10px;
        padding:10px;
        border:2.5px solid #C4C4C4;
        width:100%;
    }
    #bottom {
        clear:both;
        text-align:right;
    }

Code (markup):

 

Try adding float: left; to bouth.

 

nope that didnt work

 

I think problem with % in content main and content right