CSS Page - Flash Header misaligned... Possible to use padding in css?

Discussion in 'CSS' started by sparksflying, Jul 13, 2006.

0
  1. #1
    Hi,
    I got a css template from somewhere.. Cant even remember ! But Im having some trouble centering a flash header..

    See http://www.frankbyrnes.com

    theres no tables so cant center it that way...Im not too hot on CSS!

    Theres some usage of padding to push things around the page.. im trying that myself at the moment but some guru here might be able to push me in right direction :)

    Let me know if any ideas...

    Cheers!!
     
    sparksflying, Jul 13, 2006 IP
  2. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Well, your #wrap element is 691px wide, and your container element is 780px wide. When you use align="center" on an object, it's going to move to the center of the area in which is is residing, which in this case is the 780px container. The rest of your site does not use align="center" and is defaulting to the left side of the #container div (which makes it appear to be centered, because the parent <div>, #wrap, is supplying a margin for everything.

    Perhaps the 780px on the #container <div> is an accident? Unless you're attempting some complicated CSS techniques, there is almost never a reason for a nested element to have a width wider than its parent ;)
     
    the_pm, Jul 13, 2006 IP
  3. sparksflying

    sparksflying Peon

    Messages:
    1,066
    Likes Received:
    50
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Hi , i had found this css on free template site so unfortunately I am no good to you in trouble shooting it :)

    I tried removing the 780px and text ends up at bottom of page...

    Thanks for your assistance.. any more help greatly apreciated!
     
    sparksflying, Jul 13, 2006 IP
  4. the_pm

    the_pm Peon

    Messages:
    332
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Instead of removing the width entirely, try making it width:691px and see if that solves the problem :)
     
    the_pm, Jul 13, 2006 IP
  5. sparksflying

    sparksflying Peon

    Messages:
    1,066
    Likes Received:
    50
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Yep tried that and f**ks it all up :) D'oh!

    I must try figure it out.. cant be rocket science!

    Thanks for your help..
     
    sparksflying, Jul 13, 2006 IP
  6. danielbruzual

    danielbruzual Active Member

    Messages:
    906
    Likes Received:
    57
    Best Answers:
    0
    Trophy Points:
    70
    #6
    Try using something along the lines of

    position: relative;
    right: 50px;


    Let me know if it works,

    Daniel
     
    danielbruzual, Jul 13, 2006 IP
  7. sparksflying

    sparksflying Peon

    Messages:
    1,066
    Likes Received:
    50
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Daniel ,

    I had to give you a vote.. Im also passing one to "the_pm".. It never ceases to amaze me here on this forum the willingness of people to help each other.

    Im only starting off really but try and help out where possible...

    The two lines of code :

    position: relative;
    right: 50px; ( I actually used 31px)

    Have worked a charm and Im grateful...

    Thanks again Guys & Gals!

    Sparks!
     
    sparksflying, Jul 13, 2006 IP
  8. danielbruzual

    danielbruzual Active Member

    Messages:
    906
    Likes Received:
    57
    Best Answers:
    0
    Trophy Points:
    70
    #8
    You are most certainly welcome sparksflying! Glad to help out others when it comes to css (I sure like to get help when Internet Explorer starts misbehaving :p)

    Thanks,
    Daniel
     
    danielbruzual, Jul 13, 2006 IP