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 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2007
    Posts
    49
    Thanks
    2
    Thanked 1 Time in 1 Post

    problem with positioning, images, links, to float or not to float? etc

    k. a challenge.



    how should i go about those circles at the bottom being nav buttons?

    i originally was going to this:

    <ul id="circlelist">
    <li class="circles">myspace</li>
    <li class="circles">library</li>
    (etc)
    </ul>

    then for css

    #circlelist (positioning stuff, display inline maybe?)

    li.circles {

    background image of the circles

    }

    but the problem, although that would have been clever, is that the link couldn't be the list item, it would have to be the text inside, but i want the entire circle to be the link...

    so i'm thinking that i'm just going to have to make the circles with the text inside AS images, then make the images links... and have all the images float next to each other... ugh... any advice?

  • #2
    New to the CF scene
    Join Date
    Oct 2007
    Posts
    6
    Thanks
    0
    Thanked 1 Time in 1 Post
    I would rather go with floating in a fixed width container. (Note: the ie 3px bug on floated elements with image background) but even that bug exists, it can be easily fixed and it will save the hassle of positioning.
    xHTML Coding | Cheap Web Hosting | SEO Blog
    Life rocks and we roll.

  • #3
    New Coder
    Join Date
    Oct 2007
    Posts
    49
    Thanks
    2
    Thanked 1 Time in 1 Post
    i think that's what i was going to go with.

    so, make the circles their own images,

    myspace circle
    contact circle
    etc, right?

    then to float all these images/links within the containing div??

  • #4
    New to the CF scene
    Join Date
    Oct 2007
    Posts
    6
    Thanks
    0
    Thanked 1 Time in 1 Post
    I would actually use one single image and keep the content in plain text (for seo purpose and it will reduce the size of images in the site aka faster load).
    xHTML Coding | Cheap Web Hosting | SEO Blog
    Life rocks and we roll.

  • #5
    New Coder
    Join Date
    Oct 2007
    Posts
    49
    Thanks
    2
    Thanked 1 Time in 1 Post
    well yeah that's true, but then how do i position the text in the center that way, and also how do i make the circle itself a link instead of just the text... ?

    ergh... i guess, tell me if this makes sense.

    -div container -
    - link - image - p - endlink -

    but then i'd have to put the p in classes or ids and position them inside the images... and even then, wouldn't i have to do some weird absolute positioning for the text to rest over the images? or should i just do divs with bg images instead of images?

  • #6
    New to the CF scene
    Join Date
    Oct 2007
    Posts
    6
    Thanks
    0
    Thanked 1 Time in 1 Post
    Use padding for the li a it won't become a perfect circle link, but will cover most of the part. Anyway it is always up to you if you want to use text with only 1 background image or more.
    xHTML Coding | Cheap Web Hosting | SEO Blog
    Life rocks and we roll.


  •  

    Posting Permissions

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