SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    734
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    could i have some box sizing advice please.

    trying out box sizing to place two links side by side
    http://cdiwwwtest.cdicorp.com/staffing
    Also using relative & absolute positioning.
    what has me a bit confused is how to best center the text. I think I only kinda hacked it so far.
    & why is the gradient I used off on one of the boxes?
    thank you
    D

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,214
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    It's not clear where you want those links to go, and I can't see any attempt at sizing at this point. What have you tried?

    You still haven't optimised those background images on your site. They take AGES to load. Your users will hate you if you don't correct this. It's much more important than styling those links.

  3. #3
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    734
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Good morning there
    Well. for the box sizing...how do i center the boxes side by side w/in the containing wrap. & center the text w/in the individual boxes...
    No matter how I play w/the margin & padding so far i seem to be off.

    as for the background images...I am open to advice.

    Actually someone else on the team is now working on them. I think he has actually reduced them on size already. Don't know what process he uses but he is supposed to be pretty experienced.
    I read the previous material that was referred to me. Used photoshop optimization for them...I must be missing a step there.

    I run into this yesterday while i was looking for something else
    http://css-tricks.com/perfect-full-p...kground-image/
    just getting to read it now. And will fwd it on along w/any advice on how to improve on the download time.

    thx
    D

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,214
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by pdxSherpa View Post
    how do i center the boxes side by side w/in the containing wrap. & center the text w/in the individual boxes...
    Could you post an image of how you want them to look? I think that background image will be very distracting.

  5. #5
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    734
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    not 100% sure.
    but right now i'd like to understand how to affect the padding and margin so the two boxes are side by side and the text is centered. even if the boxes expand horizontally or vertically.
    also why is it that the gradient doesn't line up evenly?
    Thank you
    D

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,214
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by pdxSherpa View Post
    right now i'd like to understand how to affect the padding and margin so the two boxes are side by side and the text is centered.
    Padding and margins are not what you need to be looking at here, so that's the problem.

    There are various options, but I'd be looking at display: inline-block or perhaps display: table. Here's a starting point with display: inline-block:

    Code:
    .staffingCtr {text-align: center;}
    .staffingCtr div {display: inline-block; padding: 20px;}
    why is it that the gradient doesn't line up evenly
    No idea what you mean there.

  7. #7
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    734
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thanks Ralph!
    will work on that.
    as for the button's gradients I meant what while they are side by side the gradient is slightly diff in each box.
    D

  8. #8
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,535
    Mentioned
    62 Post(s)
    Tagged
    2 Thread(s)
    The buttons with the gradients have disappeared.

  9. #9
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    734
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    oh that is sooo funny. Thank you wp.
    yeah it's really weird we have been running in a few such bugs where code disappear or reverts.
    Thx Ronpat!


Tags for this Thread

Bookmarks

Posting Permissions

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