WordPress.org

Ready to get started?Download WordPress

Forums

Sidebar does not move properly. (2 posts)

  1. adviserzee
    Member
    Posted 1 year ago #

    Dear All, i am facing a problem regarding layout of of my website. On my website site, i have content on the left side and sidebar on the right side. When using zoomin option in browser, the content move properly while sidebar does not move properly. please help me in this regard as i am providing my css code below.

    http://www.islahemuslim.com

    [ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]

    /* =Structure
    ----------------------------------------------- */
    
    body {
    	padding: 0 2em;
    }
    #page {
    	margin: 0px auto;
    	max-width: 960px;
    }
    #branding hgroup {
    	margin: 0 7.6%;
    }
    #access div {
    
    }
    #primary {
      float: left;
      margin: 0 -26.4% 0 0;
      width: 112px;
    }
    #content {
      margin: 0 34% 0 7.6%;
      width: 694px;
    }
    .page-id-122 #content{
    	margin:0 290px 0 0;
    }
    #secondary {
    	float: right;
    	margin-right: 0%;
    	width: 18.8%;
    }
    
    /* Singular */
    .singular #primary {
    
    }
    .singular #content,
    .left-sidebar.singular #content {
    	position: relative;
    	width: auto;
    }
    .singular .entry-header,
    .singular .entry-content,
    .singular footer.entry-meta,
    .singular #comments-title {
    	margin: -11px auto;
    	width: 738px;
    	font-family: 'MyriadPro-Regular';
    }
    
    /* Attachments */
    .singular .image-attachment .entry-content {
    	margin: 0 auto;
    	width: auto;
    }
    .singular .image-attachment .entry-description {
    	margin: 0 auto;
    	width: 68.9%;
    }
    
    /* Showcase */
    .page-template-showcase-php #primary,
    .left-sidebar.page-template-showcase-php #primary {
    	margin: 0;
    }
    .page-template-showcase-php #content,
    .left-sidebar.page-template-showcase-php #content {
    	margin: 0 7.6%;
    	width: auto;
    }
    .page-template-showcase-php section.recent-posts {
    	float: right;
    	margin: 0 0 0 31%;
    	width: 69%;
    }
    .page-template-showcase-php #main .widget-area {
    	float: left;
    	margin: 0 -22.15% 0 0;
    	width: 22.15%;
    }
    
    /* error404 */
    .error404 #primary {
    	float: none;
    	margin: 0;
    }
    .error404 #primary #content {
    	margin: 0 7.6%;
    	width: auto;
    }
    
    /* Alignment */
    .alignleft {
    	display: inline;
    	float: left;
    	margin-right: 1.625em;
    }
    .alignright {
    	display: inline;
    	float: right;
    	margin-left: 1.625em;
    }
    .aligncenter {
    	clear: both;
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    /* Right Content */
    .left-sidebar #primary {
    	float: right;
    	margin: 0 0 0 -26.4%;
    	width: 100%;
    }
    .left-sidebar #content {
    	margin: 0 7.6% 0 34%;
    	width: 58.4%;
    }
    .left-sidebar #secondary {
    	float: left;
    	margin-left: 7.6%;
    	margin-right: 0;
    	width: 18.8%;
    }
    
    /* One column */
    .one-column #page {
    	max-width: 690px;
    }
    .one-column #content {
    	margin: 0 7.6%;
    	width: auto;
    }
    .one-column #nav-below {
    	border-bottom: 1px solid #ddd;
    	margin-bottom: 1.625em;
    }
    .one-column #secondary {
    	float: none;
    	margin: 0 7.6%;
    	width: auto;
    }
    /* Simplify the showcase template */
    .one-column .page-template-showcase-php section.recent-posts {
    	float: none;
    	margin: 0;
    	width: 100%;
    }
    .one-column .page-template-showcase-php #main .widget-area {
    	float: none;
    	margin: 0;
    	width: auto;
    }
    .one-column .page-template-showcase-php .other-recent-posts {
    	border-bottom: 1px solid #ddd;
    }
    /* Simplify the showcase template when small feature */
    .one-column section.featured-post .attachment-small-feature {
    	border: none;
    	display: block;
    	height: auto;
    	max-width: 60%;
    	position: static;
  2. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    In Firefox, the content does not resize properly at all either.

    That looks like a modified version of twentyeleven? If you made changes to theme files and the CSS, the responsiveness may not be working as it should.

    Start by validating your pages for errors as they can cause problems:

    http://codex.wordpress.org/Validating_a_Website

    Then move on to looking at the CSS that is affecting the resizing.

Topic Closed

This topic has been closed to new replies.

About this Topic