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 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jul 2013
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question How do i get container to touch the top of page

    Please help me heres my code
    Code:
    #topbanner	{
    			background-color:#000000;
    			padding-top: 50px;
    			border-radius:20px;
    			background-image:url('clouds.png');
    			margin: 0 auto;		
    			}
    heres my result http://i39.tinypic.com/2w1uk2s.png

    but i want that container to not leave any gaps at the top or the left, as it has.
    Thank You
    P.S (Sorry i don't know how to embed images on this forum quite yet)

  • #2
    Senior Coder whizard's Avatar
    Join Date
    Jan 2005
    Location
    Philadelphia, PA, USA
    Posts
    1,662
    Thanks
    14
    Thanked 76 Times in 76 Posts
    margin: 0px;

    If it is the first element in your page, it should now be in the top left corner.

    Does clouds.png have that whitespace in it? If so, that may be why you see a white space at the top/left.

    Edit: Also, make sure you don't have any padding in your body or html elements. Often, people include this code:
    Code:
    *{
    padding: 0;
    margin: 0;
    }
    at the top of their CSS, to automatically give all elements NO padding or margin as default. The * selector is known as the universal selector, meaning it applies to ALL elements.



    HTH
    Dan
    Last edited by whizard; 07-04-2013 at 04:16 PM.
    PHP Tip: If you want to use short tags (<? or <?=$var) then make sure short_open_tag is set to "1". It really helps.

    Don't forget to save everyone time and mark your thread as Resolved :)

    "Also note that it is your responsibility to die() if necessary."

    DON'T USE THE MYSQL_ EXTENSION

  • #3
    New Coder
    Join Date
    Jul 2013
    Location
    Netherlands
    Posts
    20
    Thanks
    1
    Thanked 3 Times in 3 Posts
    If you're talking about the "topbanner" code provided, you might want to change "padding-top" into "0px" as well.

  • #4
    Senior Coder whizard's Avatar
    Join Date
    Jan 2005
    Location
    Philadelphia, PA, USA
    Posts
    1,662
    Thanks
    14
    Thanked 76 Times in 76 Posts
    The padding-top is used to center his text on the image, I believe.

    Alternatively, he could simply set the line-height to the height of the image, and the text would be vertically centered.

    HTH
    Dan
    Last edited by whizard; 07-04-2013 at 04:16 PM.
    PHP Tip: If you want to use short tags (<? or <?=$var) then make sure short_open_tag is set to "1". It really helps.

    Don't forget to save everyone time and mark your thread as Resolved :)

    "Also note that it is your responsibility to die() if necessary."

    DON'T USE THE MYSQL_ EXTENSION


  •  

    Posting Permissions

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