Sidebar not aligning

Community Forums Forums Design Tips and Tricks Sidebar not aligning

This topic is: not resolved

Tagged: , ,

This topic contains 2 replies, has 2 voices, and was last updated by  Gary Jones 1 year ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #58915

    David Neff
    Participant
    Post count: 48

    Hello all,

    I am having some trouble with the sidebar. My sidebar is set to float right and the content left. The sidebar, however, is displaying at the bottom right instead of the top right. Why is that?

    Screenshot: http://doubtingdave.com/wp-content/uploads/2013/08/Screenshot-16.png

    Here is the code:

    
    #content{
    	padding:20px;
    	margin-top:10px;
    	clear: both;
    }
    #content p{
    	padding-top:20px;
    	clear: both;
    }
    #content ol,
    #content ul{
    	padding-top:20px;
    }
    
    #content-sidebar-wrap {
    	float: left;
    	width: 810px;
    	margin: 0 auto;
    	background-color:#FFF;
    	clear: both;
    }
    
    .content-sidebar #content-sidebar-wrap,
    .full-width-content #content-sidebar-wrap,
    .sidebar-content #content-sidebar-wrap {
    	width: 960px;
    }
    
    .sidebar-content-sidebar #content-sidebar-wrap,
    .sidebar-sidebar-content #content-sidebar-wrap {
    	float: right;
    }
    
    .content-sidebar #content,
    .sidebar-content #content {
    	width: 600px;
    }
    .sidebar-content #content,
    .sidebar-sidebar-content #content {
    	float: right;
    }
    .sidebar {
    	display: inline;
    	float: right;
    	font-size: 13px;
    	line-height: 20px;
    	width: 300px;
    	margin-right:5px;
    	background-color: #f5f5f5;
    }
    
    .sidebar p {
    	font-size: 13px;
    	line-height: 20px;
    }
    
    #sidebar .widget,
    #sidebar-alt .widget {
    	border-bottom: 1px solid #ddd;
    }
    
    .content-sidebar #sidebar .widget,
    .sidebar-content-sidebar #sidebar .widget,
    .content-sidebar-sidebar #sidebar .widget,
    .content-sidebar-sidebar #sidebar-alt .widget {
    	border-left: 1px solid #ddd;
    }
    
    .sidebar-content #sidebar .widget,
    .sidebar-content-sidebar #sidebar-alt .widget,
    .sidebar-sidebar-content #sidebar .widget,
    .sidebar-sidebar-content #sidebar-alt .widget {
    	border-right: 1px solid #ddd;
    }
    
    .sidebar .widget-wrap {
    	border: 4px solid #f5f5f5;
    	padding: 15px 20px 20px;
    }
    
    .sidebar .widget ul {
    	margin: 5px 0 -5px;
    }
    
    .home-middle .widget ul li,
    .sidebar .widget ul li,
    .sidebar .widget-area ul li {
    	background: url(images/list.png) no-repeat top left;
    	border-bottom: 1px dotted #ddd;
    	list-style-type: none;
    	margin: 0 0 7px;
    	padding: 0 0 5px 18px;
    	word-wrap: break-word;
    }
    
    
    #58939

    David Neff
    Participant
    Post count: 48

    ?

    #58976

    Gary Jones
    Moderator
    Post count: 691

    Don’t respond to your own opening post – it knocks the thread off of the unanswered threads list.

    The usual reason is that content + sidebar (widths and margins for both) come to more than the width – padding allowed for #content-sidebar-wrap. In this case however, a very quick count up suggests that it all seems fine. Without access to the actual site, it’s difficult to diagnose, but have you checked to see if floating the #content left solves the problem?


    Changes in Genesis 2.1 – the ultimate guide to every single change in Genesis Framework 2.1, 2.1.1 and 2.1.2 (all 90 of them!) | @GaryJ

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.