WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Line Spacing ISSUE (8 posts)

  1. cocopops
    Member
    Posted 4 years ago #

    Hello!! I am new to wordpress n PHP and i have an issue. I downloaded wordpress and a theme. Now i am trying to remake it to my own, and it has gone very good this far. But I have an issue regarding the line spacing in the text.

    Check these pictures out (both these pictures concist of TWO parts, sorry i didnt put any line/break to show it):

    http://i271.photobucket.com/albums/jj124/sanianik/pic1.jpg

    http://i271.photobucket.com/albums/jj124/sanianik/pic2.jpg

    As you can see in the first picture, when clicking in the ARCHIVES/CATEGORIES section of the blog, and you see the miniatures of each post, the line spacing is very tight. But when you click on the actual POST, the line spacing is doubled (the lower part of the first picture).

    Looking at the code (picture 2), i changed the line-height to 4px from 15 px, this made the POST line spacing TIGHTER as you can see in the upper part of the second picture. But while doing so, the line spacing of the ARCHIVES/CATEGORIES section becomes TOO tight and the text crosses eachother (lower part of second picture)???? Why is this???

    Please somebody help me out!! ID APPRECIATE IT!!

    THNX!!

  2. figaro
    Member
    Posted 4 years ago #

    If you would provide a link to the actual site so people could look at your css, then you may get better help...it's hard to diagnose css problems from screen captures.

  3. cocopops
    Member
    Posted 4 years ago #

    i havent really put up my site yet maybe i can put my css code up here and and u can look at it??

  4. figaro
    Member
    Posted 4 years ago #

    The point is, if your site is up, then we can look at it, and test it, in Firebug. I'm not good enough to just look at a bunch of css and spot this kind of problem...maybe others here can help though.

  5. cocopops
    Member
    Posted 4 years ago #

    Dont know if this information is any helpful, but heres some part of the CSS code...THANKS!!

    h1, h2, h3 {
    margin-top: 0px;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-weight: normal;
    color: #3f2d1b;
    }

    h1 {
    font-size: 2em;
    }

    h2 {
    font-size: 1.6em;
    }

    h3 {
    font-size: 1.6em;
    }

    ul, ol {
    margin-top: 0;
    line-height: 25%;
    }

    li {
    line-height: 25%;

    }

    p {
    margin-top: 7px;
    line-height: 15px;
    }

    ul, ol {
    }

    .post {
    }

    .post .title {
    color: #000000;
    }

    .post .title a {
    background: none;
    color: #3f2d1b;
    border: none;
    }

    .post .title a:hover {
    text-decoration: underline;
    }

    .post .meta {
    border-bottom: 1px dashed #D2D4C9;
    padding-bottom: 3px;
    text-align: right;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    font-style: italic;
    }

    .post .entry {
    padding: 10px 0 20px 0;
    text-align: justify;

  6. csleh
    Member
    Posted 4 years ago #

    try adding

    body{line-height:1;}

    then take out the other line-height declarations from ul, ol, li, p. There doesn't seem to be declaration for size anywhere, unless there's one in body? Something like font-size:80% or such?

    It'll be easier then to adjust then all with something like ul, li, ol, p{line-height:1.4em;}.

    Try using firefox and install the firebug plugin for firefox to quickly test out variations.

  7. cocopops
    Member
    Posted 4 years ago #

    ohh thanks! i will try that out =)

    i have firebug on firefox, will try it on there!

  8. cocopops
    Member
    Posted 4 years ago #

    the problem lied in the <p> code! for the latest post, there was a <p></p> for each row! that created the big spacing! it had nothing to do with the actual line-height code! =)

    just figured it out

    thnx anyways folks

Topic Closed

This topic has been closed to new replies.

About this Topic