Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Apr 2010
    Posts
    207
    Thanks
    30
    Thanked 0 Times in 0 Posts

    A few minor css items being a pain.....

    Here is the page I am working on....

    http://billboardfamily.com/?page_id=26

    I need a few things to happen int he main content area, but I can not seem to get them to work...I am very close however.

    1) I want the last section, titled "Other Media Outlets", to move down to make all the lines in the left and right columns even, ending in the exact same position.

    2) I need the right column to move a bit to the right so it is the same distance from the edge of the container as the left column is....I also want the gap between the 2 columns to be wider....this might be accomplished together.

    I have tried all types of css to get this all to come together, but it is not happening for me. Please help me out if you can!
    Website: www.billboardfamily.com
    Twitter: www.twitter.com/billboardfamily
    Facebook Fan Page: www.facebook.com/BillboardFamily
    Facebook (Carl): www.facebook.com/CarlMartin.BillboardFamily (admin note: sig should be <=4 lines)

  • #2
    New Coder
    Join Date
    Dec 2009
    Posts
    96
    Thanks
    1
    Thanked 2 Times in 2 Posts
    To align them, change the paddings of these:

    Code:
    .column2 h3
    padding: 9px 5px 6px
    
    .column2 {
    padding-bottom:16px;
    Lemme know if that helps.

    Edit:

    Just saw the page in IE and there's a lot more that's messed up.... Have you checked the page in IE?

  • Users who have thanked Bar2aYunie for this post:

    CarlMartin10 (08-08-2010)

  • #3
    Regular Coder
    Join Date
    Apr 2010
    Posts
    207
    Thanks
    30
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Bar2aYunie View Post
    To align them, change the paddings of these:

    Code:
    .column2 h3
    padding: 9px 5px 6px
    
    .column2 {
    padding-bottom:16px;
    Lemme know if that helps.

    Edit:

    Just saw the page in IE and there's a lot more that's messed up.... Have you checked the page in IE?
    I fixed the IE issue...it was the .pressinner - I just changed the background color, and it is all good.

    There is still one final issue -- the lines under the h3 headings is shorter or longer than the other lines below in the rows....how can I fix that?
    Last edited by CarlMartin10; 08-08-2010 at 11:24 PM.
    Website: www.billboardfamily.com
    Twitter: www.twitter.com/billboardfamily
    Facebook Fan Page: www.facebook.com/BillboardFamily
    Facebook (Carl): www.facebook.com/CarlMartin.BillboardFamily (admin note: sig should be <=4 lines)

  • #4
    New Coder
    Join Date
    Dec 2009
    Posts
    96
    Thanks
    1
    Thanked 2 Times in 2 Posts
    That is because the three headers don't have the same length as all of the other lines. The left one is wider and the two right ones are smaller. I was searching through the code, try add:

    Code:
    .column1 h3
    width: 445px;
    for the left one. Do the same with the appropriate width to the two right ones. I think you can find them right? (gotta go now, if not tell me)

    also, the code for IE is still messed up... the whole menu is moved downwards, into the lines. I included a screenshot, check the menu, it's in a very light color on the same line as the two top headers.
    Attached Thumbnails Attached Thumbnails A few minor css items being a pain.....-test.jpg  

  • #5
    New Coder
    Join Date
    Aug 2010
    Location
    Oregon
    Posts
    34
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Think you are having resolution issues. Might want to try %'s instead of hard numbers. Either that or start fixing positions. REason I'm saying this is I was looking ati it in 1280 just fine bot at 1024 it got a little wonky
    Last edited by Taraes; 08-09-2010 at 12:49 AM.

  • #6
    Regular Coder
    Join Date
    Apr 2010
    Posts
    207
    Thanks
    30
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Bar2aYunie View Post
    That is because the three headers don't have the same length as all of the other lines. The left one is wider and the two right ones are smaller. I was searching through the code, try add:

    Code:
    .column1 h3
    width: 445px;
    for the left one. Do the same with the appropriate width to the two right ones. I think you can find them right? (gotta go now, if not tell me)

    also, the code for IE is still messed up... the whole menu is moved downwards, into the lines. I included a screenshot, check the menu, it's in a very light color on the same line as the two top headers.
    Does this look crazy in IE to anyone else? It looks perfect in IE8 on my machine....
    Website: www.billboardfamily.com
    Twitter: www.twitter.com/billboardfamily
    Facebook Fan Page: www.facebook.com/BillboardFamily
    Facebook (Carl): www.facebook.com/CarlMartin.BillboardFamily (admin note: sig should be <=4 lines)

  • #7
    New Coder
    Join Date
    Dec 2009
    Posts
    96
    Thanks
    1
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by Taraes View Post
    Think you are having resolution issues. Might want to try %'s instead of hard numbers. Either that or start fixing positions. REason I'm saying this is I was looking ati it in 1280 just fine bot at 1024 it got a little wonky
    Very possible, that's why I pointed it out. I mean it's great if it works on your computer, but if one of the viewers of the site have another resolution, it's a pain in the *** if the layout is messed up. Right?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •