WordPress.org

Support

Support » Themes and Templates » [Resolved] [Twenty Eleven] Two-Column Theme Increase Width Content Remove UP Border Navi

[Resolved] [Twenty Eleven] Two-Column Theme Increase Width Content Remove UP Border Navi

  • Hi guys,

    I’m using TwentyEleven as a two-column theme and I’m working with a child theme.
    I want to know what to add to the style.css of my child theme to increase the width of the content.

    Next to that I’m also wondering how to remove the upper grey border in my navigation. I’ve seemed to remove the rest of the borders but the only one that stays on the page is the upper one and i can’t seem to get rid of it!

    My site is closed, but here’s a screenshot of what it looks like with the upper border: http://i50.tinypic.com/zsmhdu.png.

    Thanks in advance.

Viewing 15 replies - 1 through 15 (of 34 total)
  • Can you pastebin.com your HTML and CSS for one page relevant?

    /*
    Theme Name:            Twenty Eleven Child
    Theme URI:                http://oneofpoints.com
    Description:                Child theme for the Twenty Eleven Theme
    Author:                         Puck Litaay
    Author URI:                 http://oneofpoints.com/about/
    Template:                    twentyeleven
    Version:                       0.1.
    */ 
    
    @import url(http://fonts.googleapis.com/css?family=Questrial|Montserrat);
    @import url(http://fonts.googleapis.com/css?family=Alegreya+SC);
    @import url("../twentyeleven/style.css"); 
    
    #site-title a {
        color:  #000;
    } 
    
    #branding #searchform {
    display:none;
    }
    
    #access a {
     font-family: 'Questrial', serif; !important;
     font-size: 20px !important;
     text-transform:uppercase;
     color: #000 !important;
     display:block;
     line-height:3.333em;
     text-decoration:none;
     padding:0 1.2125em;
    }
    
    #access a:focus {
    background:white;
    }
    
    #access li:hover > a,#access ul ul :hover > a,#access a:focus {
    background:#1983d1; /* changes bg color of drop-down menus that have the mouse over them */
    color:white !important; /* changes text color when moused over */
    }
    
    #access {
    background:white;
    -webkit-box-shadow:rgba(0,0,0,0) 0 0 0;
    -moz-box-shadow:rgba(0,0,0,0) 0 0 0;
    box-shadow:rgba(0,0,0,0) 0 0 0;
    }
    
    #access ul ul a {
    background:white;
    border-bottom:0;
    color:#515151;
    font-size:14px;
    font-weight:normal;
    height:auto;
    line-height:1.4em;
    width:168px;
    padding:5px 15px;
    }
    
    .entry-title {
    	clear: both;
    	color: #222; /*Change This to whatever color you want*/
    	font-size: 24px; /*Change This to size you want*/
            font-family: 'Alegreya SC', serif; !important;
            text-transform: uppercase;
    	font-weight: bold;
    	line-height: 1.5em;
    	padding-bottom: .3em;
    	padding-top: 15px;
    }
    
    img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img
    {border: none;}

    This is my CSS, the html can be found here pastebin.com

    To increase the width of the content.

    Can you specify which element?

    Next to that I’m also wondering how to remove the upper grey border in my navigation.

    Apply;

    #branding {
     border-top: 0;
    }

    I think it’s the entry or the entry-content in the style.css

    Thanks that code worked. 🙂

    Is this what you mean?

    #content {
     width: yourWidth;
    }

    http://www.w3schools.com/cssref/pr_dim_width.asp

    Yes, I think it is. I edited the width but it isn’t working still.
    In the twenty eleven theme the page where the posts are displayed, the content area, is smaller then the header. I want to increase the width so it’s bigger and it matches the header’s 1000px

    Can you post what you have attempted, when changing the width?

    just this: #content {
    width: 800px;
    }

    With a random width

    There may be some style overriding it that I can’t replicate, so try adding !important on the end.
    E.g

    width: 800px !important;

    http://webdesign.about.com/od/css/f/blcssfaqimportn.htm

    Thanks, that was indeed the case, but now I want to move that same area to the right. How do I do this then? 🙂

    Do you want to swap the sidebar and content positions around?

    Yes. I like the way the way that the sidebar is positioned on the right and the content on the left. I just want to move the content position more to the left so it matches the start of the header. 🙂

    Try;

    #secondary {
     float: left;
    }
    
    #primary {
     float: right;
    }

    I just place this in my style.css of the child theme?

    I added it, but it doesn’t work – even when I add !important;

Viewing 15 replies - 1 through 15 (of 34 total)
  • The topic ‘[Resolved] [Twenty Eleven] Two-Column Theme Increase Width Content Remove UP Border Navi’ is closed to new replies.
Skip to toolbar