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 9 of 9
  1. #1
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Centre menu and other minor issue

    Just spend ages sorting out the menu properly and still working on it but my next issue is getting two buttons on the bottom right hand corner of the banner. How would I go about doing this?
    Last edited by snowdude2004; 07-17-2011 at 09:14 PM.

  • #2
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Never mind about the align bit, I played around with the float feature and solved it but now need to try the button part...
    Last edited by snowdude2004; 07-17-2011 at 09:14 PM.

  • #3
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    You could set the banner to position: relative;
    then set the buttons div to position: absolute; to the bottom of the banner

    Code:
    .banner {
     position: relative;
    }
    
    .banner .buttons {
     position: absolute;
     bottom: 0;
     right: 0;
     width: 200px;
     height: 50px;
    }
    Code:
    <div class="banner">
     <div class="buttons">
       <button></button> 
       <button></button>
     </div>
    </div>
    </div>

  • Users who have thanked Sammy12 for this post:

    snowdude2004 (07-21-2011)

  • #4
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts
    Cheers for your input but I can't find a way for that code to work.
    If you look at my current code to get the banner I have at the moment it's from a h1 tag and i've tried playing around with the html and css and it still will not work

  • #5
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts
    errgghh I removed the link. The url is: http://devious-design.co.uk/final_test.html

  • #6
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    did you get that background from backgroundlabs? I swear I've seen that somewhere

    ---

    You probably want to set the header as <div id="mastHead"></div> or something. You need a lot more customizability than an h1 tag. In that case, set the mastHead to position: relative; and absolute the buttons to the bottom right or however you choose to place them.

  • #7
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts
    I got it from somewhere on the net years ago, I don't think it was that particular site though....
    Anyway back on topic, anyone know what I need to do to my code to get this bloody thing to work?

  • #8
    Registered User
    Join Date
    Jun 2011
    Posts
    1,063
    Thanks
    12
    Thanked 241 Times in 240 Posts
    you can't use image without sufficient markup of the source with a non-commercial (noderiv) license or specific license granting you the privilege to use the image without stating so in the script

    ---

    This is getting me a little bit annoyed. I've already stated twice that the only way to position buttons to the bottom of the container is with position: absolute; + you put text-indent: -9999px; on your h1 tag. that only works if you use float: left. that's for search bots. the problem is if you have a bunch of <img> or <button>s within your h1, it really serves no purpose as all of this is spam to a search. for the last time, you need to use a <div> for your header
    Last edited by Sammy12; 07-18-2011 at 06:15 PM.

  • #9
    New Coder
    Join Date
    Aug 2009
    Posts
    51
    Thanks
    10
    Thanked 0 Times in 0 Posts
    all sorted now. thanks
    Last edited by snowdude2004; 07-21-2011 at 12:33 PM.


  •  

    Posting Permissions

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