WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Rounded V2 purple edition - can't handle long posts (6 posts)

  1. juliannasculpts
    Member
    Posted 6 years ago #

    I'm using the Rounded V2 purple edition theme, and it doesn't seem to be able to handle long posts (example).

    I tried extending the height of the images, but that didn't seem to do anything.

    Does anyone have any insight into how I can adjust the theme to handle longer posts?

  2. Jerry
    Member
    Posted 6 years ago #

    Seems fine to me! Care to be specific?

  3. juliannasculpts
    Member
    Posted 6 years ago #

    For me, that page looks like this:
    http://blog.juliannayau.com/images/theme.jpg

  4. Jerry
    Member
    Posted 6 years ago #

    Heres the prob:

    #content .storycontent {
    	background: url(img/csbbody-l.gif) no-repeat bottom left;
    	margin: 0 0 0 0;
    	padding: 5px 30px 31px 20px;
    }

    It seems the 'background' isn't repeating vertically, change no-repeat to repeat-y so your new code will be:

    #content .storycontent {
    	background: url(img/csbbody-l.gif) repeat-y bottom left;
    	margin: 0 0 0 0;
    	padding: 5px 30px 31px 20px;
    }
  5. juliannasculpts
    Member
    Posted 6 years ago #

    Thanks. I also had to make the following change:

    #content .post{
    	background: url(img/csbbody-r.gif) no-repeat bottom right;
    	font-size: 100%;
    	width: 100%;
    	color: #4F402A;
    	margin: 0 0 0 0;
    
    }

    to:

    #content .post{
    	background: url(img/csbbody-r.gif) repeat-y bottom right;
    	font-size: 100%;
    	width: 100%;
    	color: #4F402A;
    	margin: 0 0 0 0;
    
    }

    The problem is the background image includes part of the rounded corners, so I think I need to do some more tweaking to the theme.

  6. juliannasculpts
    Member
    Posted 6 years ago #

    After some more work, I managed to find the final fix.

    Step 1:
    Backup csbbody-l.gif and csbbody-r.gif (in the "img" folder).

    Step 2:
    Remove the bottom (rounded corner portion) of csbbody-l.gif and csbbody-r.gif

    Step 3:
    Using the backups from Step 1, create new csbbottom-l.gif and csbbottom-r.gif with the bottom (rounded corner portion).

    Step 4:
    In style.css, change:

    #content .storycontent {
    	background: url(img/csbbody-l.gif) no-repeat bottom left;
    	margin: 0 0 0 0;
    	padding: 5px 30px 31px 20px;
    }

    to

    #content .storycontent {
    	background: url(img/csbbody-l.gif) repeat-y bottom left;
    	margin: 0 0 0 0;
    	padding: 5px 30px 31px 20px;
    }

    Step 5:
    In style.css, change:

    #content .post{
    	background: url(img/csbbody-r.gif) no-repeat bottom right;
    	font-size: 100%;
    	width: 100%;
    	color: #4F402A;
    	margin: 0 0 0 0;
    
    }

    to

    #content .post{
    	background: url(img/csbbody-r.gif) repeat-y bottom right;
    	font-size: 100%;
    	width: 100%;
    	color: #4F402A;
    	margin: 0 0 0 0;
    
    }

    Step 5:
    In style.css, add:

    #content .bottomright{
    	background: url(img/csbbottom-r.gif) no-repeat bottom right;
    	font-size: 100%;
    	width: 100%;
    	color: #4F402A;
    	margin: 0 0 0 0;
    
    }
    
    #content .bottomleft{
    			background: url(img/csbbottom-l.gif) repeat-y bottom left;
    			margin: 0 0 0 0;
    			padding: 5px 30px 31px 20px;
    }

    (this can be added anywhere; I put it at the end of the section with all the other content styling)

    Step 6:
    In index.php, add the following after <!-- end STORYCONTENT -->

    <div class="bottomright">
    <div class="bottomleft">&nbsp;</div>
    </div>

Topic Closed

This topic has been closed to new replies.

About this Topic