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 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2010
    Location
    Sheffield
    Posts
    824
    Thanks
    93
    Thanked 18 Times in 18 Posts

    Vertical align text to the top of a div

    EDIT: Didnt mean div i meant <p>, oops >.<.


    See picture attatched

    Code:
    .title {
    
    position:relative;
    top:-30px;
    background-color:#666666;
    padding-left:10px;
    padding-bottom:0px;
    vertical-align:text-top;
    width:334px;
    height:28px;
    margin:0;
    background-image:url('../images/contentBorderHor.jpg');
    background-repeat:repeat-x;
    background-position:bottom;
    }
    PHP Code:
    <div id="main1"><p class="title"><img src="images/indexHeader1.png" width="143" height="28" style=" background-color:#CCCCCC;" />
    <?php
    if ($_SESSION['loggedIn'] == true)
    {
        echo 
    "<a style=\"background-color:#eee;\" href=\"/inc_files/indexEdit.php?s=1\">Edit</a>";
    }
    ?></p>
    Some random test text
    </div>
    Can anyone help me figure out what i need to do so the text is at the very top of the div?

    The paragraph area stops just under the vertical line under the dark grey box. the background colours are there just whilst i was checking the sizes of different elements.
    Attached Thumbnails Attached Thumbnails Vertical align text to the top of a div-picture-1.png  

  • #2
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,338
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Try resetting all your paddings and margins to 0

    * {padding: 0; margin: 0;}
    Teed


  •  

    Posting Permissions

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