Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
How to Move Sidebar and Content Area Over
Old 01-25-2010, 04:28 PM How to Move Sidebar and Content Area Over
Junior Talker

Posts: 2
Name: Mariah Neu
Trades: 0
I currently use WordPress to edit my website, however, I can't figure out how to move the Sidebar and the content page over to the left so it's in line with the top-navigation menu.

My website's at http://www.flowersitters.com

Here's what I want to do: http://velociteen.com/SS.png

How do I edit the CSS so this occurs?

Here is the CSS:

Code:
body {
margin:0;
padding:0;
background: #cbe86b;
background: url('http://flowersitters.com/wp-content/themes/velociteen/Bubble%20Girl%20Four.jpg'); background-attachment: fixed;
color:#030736;  
text-align:left;
font-family: Arial, sans-serif;
font-size:12px;
}

#container{
background:white;
border:0px red solid;
width:825px;
margin:0 0 0px 0;}

#header {
width : 825px;
height : 275px;
margin : 0 0 0 0;
background : url('http://flowersitters.com/wp-content/themes/velociteen/Banner%203.jpg') no-repeat;
}


#wrapper{
width:800px;
margin:0px auto;}

#content {     
margin: 20px 0 0 0;
width:530px;
float:left;
}


#sidebar{
float:right;
width:220px;
height:100%;
margin:10px 0 0 0;
}

.sidebar{
padding:5px;
margin:0 0 10px 0;
border:1px solid #03073;
background-color:#cbe86b;
}



#sidebar ul li{
list-style:none;
padding: 6px 3px;
border-bottom:none;
border-bottom: 1px dotted #030736;}

#sidebar ul{
list-style:none;
padding: 6px 3px;
margin:0;}

#footer {
border:0px red solid;
margin:10px 0;
padding:0px;
width:825px;
clear:both;
}

.footercol{
border:0px solid #030736;
width:218px;
padding:15px;
margin:0 5px;
float:left;}

.footercol2{
border:1px solid #030736;
background-color:#030736;
width:218px;
padding:15px;
margin:0 5px;
float:right;}

#copyright{
padding:20px 50px;
clear:both;
border-top:10px solid #030736;
background-color:#cbe86b;}


/*Nav styling*/

#navigation {
background: #030736;
border-top:1px solid #030736;
border-bottom:1px solid #030736;
width:825px;
color: #cbe86b;
font-weight:bold;
float:left;
    }

#navigation ul {
list-style: none;
margin: 0;
padding: 0;
border: none;}
        
#navigation li {
margin: 0;
float: left;}

#navigation li a {
display: block;
text-align: center;
color: #cbe86b;
padding: 15px 20px;}

    html>body #navigation li a {
        width: auto;
        }

    #navigation li a:
     {
        background-color: #cbe86b;
        color: #030736;
        }
        
/* sub menu */
#subnav {
    clear:both;
    float:left;
    background: #47133c;
}
#subnav ul {
    margin: 0px;
    padding: 3px 0px 18px 5px;
    list-style: none;
    font: 11px/100% Arial, Helvetica, sans-serif;
}
#subnav li {
    border-right: 1px solid #0d4775;
    border-left: 1px solid #0d4775;
    padding: 5px 7px;
    margin: 0px;
    float: left;
}
#subnav li a, #subnav li a:visited, #subnav .page_item {
    text-decoration: none;
    color: #030736;
}
#subnav .current_page_item a, #subnav .current_page_item a:visited {
    color: #30261c;
}
#subnav li a:hover {
    text-decoration: none;
    color: #FFFFFF;
}


h1{
font-weight:lighter;
border-bottom:1px solid #871a44;
color:#030736;
font-size:18px;}

h2{
font-weight:lighter;
color:#030736;
font-size:16px;}


a {
color:#780001;
text-decoration:none;
}

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

.clear{clear:both;}

.post, .wrapper{
margin:0 0 10px 0;
padding:15px;
border:1px solid #ccc;
background-color:#FFFFFF;}


.alignright {
    float: right;
    }

.alignleft {
    float: left;
    }

.alignleft a, .alignright a{
display: block;
background-color:#871a44;
color:#000000;
padding:8px;}

.alignleft a:hover, .alignleft a:hover{
background-color:#871a44;
color:#030736;}


.navigation {
    display: block;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 60px;
    }


#commentform #author, #commentform #email, #commentform #url {
    background: #871a44;
    padding: .2em;
border: 1px solid #871a44;

}

.commentlist li, #commentform input, #commentform textarea {
    font-weight:normal;
    }


.commentlist li .avatar { 
    float: right;
    border: 1px solid #871a44;
    padding: 2px;
    background: #871a44;
    }

.commentlist cite{
    font-weight: normal;
    font-style: normal;
    font-size: 1.1em;
    }

.commentlist cite a {
color:#ff3399;
    font-weight: normal;
    font-style: normal;
    font-size: 1.1em;
    }

.commentlist p {
    font-weight: normal;
    line-height: 1.5em;
    text-transform: none;
    }


.commentmetadata {
    font-weight: normal;
margin: 0;
    display: block;
    }


#commentform input {
    width: 170px;
    padding: 2px;
    margin: 5px 5px 1px 0;
    }

#commentform textarea {
width:95%;
border: 1px solid #871a44;
background: #FFFFFF;
    padding: .2em;
    }

#commentform #submit {
    margin: 0;
    float: left;
    }

.alt {
    background-color: #871a44;
    border-top: 1px solid #871a44;
    border-bottom: 1px solid #871a44;
    margin: 0;

    padding: 5px;
    }


.commentlist {
    padding: 0;
    text-align: justify;

    }

.commentlist li {
    margin: 15px 0 3px;
    padding: 5px 10px 3px;
    list-style: none;
    }

.commentlist p {
    margin: 10px 0 10px 0;
    }


.nocomments {
    text-align: center;
    margin: 0;
    padding: 0;
    }


/*styling for wp-cal*/

#wp-calendar {
    empty-cells: show;
    font-size: 9px;
    margin: 0;
    width:100%;
}

#wp-calendar #next a {
    padding-right: 9px;
    text-align: right;
}

#wp-calendar #prev a {
    padding-left: 9px;
    text-align: left;
}

#wp-calendar a {
    display: block;
    text-decoration: none;
}

#wp-calendar a:hover {
    color: #030736;
}

#wp-calendar caption {
    color: #666;
    font-size: 9px;
    text-align: left;
        font-weight: normal;
}

#wp-calendar td {
    color: #666;
    font: normal 10px verdana, "Trebuchet MS", arial, tahoma, sans-serif;
    letter-spacing: normal;
    padding: 2px 0;
    text-align: center;
}

#wp-calendar td.pad:hover {
    background: #ddd;
}

#wp-calendar td:hover, #wp-calendar #today {
    background: #eaeaea;
    color: #030736;
}

#wp-calendar th {
    font-style: normal;
    text-transform: capitalize;
}
Thanks!
mariahneu is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 01-27-2010, 07:10 AM Re: How to Move Sidebar and Content Area Over
Xboxer360's Avatar
Experienced Talker

Posts: 36
Name: Dave
Location: Norwich, UK
Trades: 0
open up the php files and look for the call to the sidebar, if its at the top move it to the bottom, if its at the bottom move it to the top.

The problem lies with the order the divs are called and not the actual CSS itself.
Xboxer360 is offline
Reply With Quote
View Public Profile
 
Old 01-31-2010, 02:49 PM Re: How to Move Sidebar and Content Area Over
wongpk's Avatar
Extreme Talker

Posts: 178
Trades: 0
Did you just showed all the CSS???
__________________
Regards,
Andrew

Please login or register to view this content. Registration is FREE
|
Please login or register to view this content. Registration is FREE
|
Please login or register to view this content. Registration is FREE
wongpk is offline
Reply With Quote
View Public Profile Visit wongpk's homepage!
 
Reply     « Reply to How to Move Sidebar and Content Area Over
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.84290 seconds with 12 queries