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

    Thumbs up Want some help (CSS + HTML experts)

    Hello buddies,

    My friend has asked me a question related to web designing (CSS and HTML). I've spent many hours for doing practice and try to get some solution but its too hard for me to complete it. So now i found codingforums.com is one of the best developer's site and I believe thaat the experts should solve my problem. the problem is to remove the blank space between download now button and the add.

    Want some help (CSS + HTML experts)-screenshot_1.jpg

    You can review through directly URL and the source is: this page

    Please review the attached picture above and tell me that How to remove the Gap (empty space) between the download button and the add below. I'll thanks the team of coding forums and the experts join and solve the problems of beginners

    Thanks, Cheers!

  • #2
    Regular Coder gcmax's Avatar
    Join Date
    Sep 2010
    Location
    Leeds
    Posts
    108
    Thanks
    8
    Thanked 5 Times in 5 Posts
    No separate style sheet!

    Enclose the image in a div, make the div position absolute: This will create the image as a layer above all other layers (unless you have anything else on the page which is using absolute and has a high z-index value). Use top, bottom, left, right attributes to move the image where you want it. See example below;


    Code:
    HTML
    <div id="image">
    <img src="images/download-button.jpg" alt="Download Now"></img>
    </div>
    
    CSS
    #image {position:absolute; width:182px; height:35px; top:-30px; left:50px;}
    ---------------------------------
    website: www.gcmax.co.uk
    webmail: stevenbell@gcmax.co.uk
    ---------------------------------

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,986
    Thanks
    79
    Thanked 4,432 Times in 4,397 Posts
    Bad idea.

    If *anything* on that page must change (e.g., the massive amount of text above the button),
    the "position: absolute" will be wrong and you will have to go in an change it manually.

    Better is to use relative positioning and just move the button image downwards or the other image upwards.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    New Coder
    Join Date
    Jul 2014
    Location
    Athens, Greece
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    In the element with div class='seperator' that wraps your download button, add css style : height:30px or whatever fits best!

  • #5
    Regular Coder
    Join Date
    Aug 2005
    Location
    MS
    Posts
    837
    Thanks
    11
    Thanked 79 Times in 77 Posts
    Might want to correct some coding errors too:

    CSS [Ignore any properly formed CSS3 rules that may have been flagged]

    HTML [ 229 Errors, 145 warning(s) ] Ignore the Facebook and other third party code that was flagged.
    Last edited by Major Payne; 07-14-2014 at 10:38 AM.
    ☠ ☠RON☠ ☠


  •  

    Tags for this Thread

    Posting Permissions

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