Jump to content


Photo
- - - - -

Buddypress via Platform Pro - a few elements look messy - css fix help


  • Please log in to reply
8 replies to this topic

#1 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 08 February 2011 - 07:47 AM

` #buddypress-page form.dir-form div.dir-search { width: 28%; margin-top: -30px; } ` ` #buddypress-page form.dir-form div.dir-search input[type="submit"] { padding: 8px 5px; } ` This CSS should do most of what you want. :)

#2 siso

siso

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 08 February 2011 - 08:06 AM

Thank-you, Adam -- I appreciate your time. Last little thing about that "create a group" button. In firebug I noticed it's referring to something like: background: url("../images/button-grey-up.png") Am I missing a button/graphic I'm supposed to have in the theme which makes that button appear? That might explain the not so attractive look of the "create a group" text.

#3 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 08 February 2011 - 08:10 AM

It is possible, I couldn't see it because I wasn't logged in, but if you check firebug or a browser extension it would be able to tell you if the image is missing.

#4 siso

siso

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 10 February 2011 - 07:54 PM

Not sure if I'm checking the right way, but firebug shows me the background photo should be:

background: url("../images/button-grey-up.png"

Where does the .. signify? Is that the problem, perhaps, that it's missing the front part of the url -- or does the .. signify some directory in a logical hierarchy or something?

--- --- ---


As for the code to line things up, thanks Adam. For those who may want to know exactly how everything is lined up exactly how I have it, I tweaked it a tiny bit more to this:

#buddypress-page form.dir-form div.dir-search {
width: 33%;
margin-top: -30px;
}

#buddypress-page form.dir-form div.dir-search input[type="submit"] {
padding: 8px 5px; margin-top: -1px;
}

#5 bryan-hadaway

bryan-hadaway

    Advocate

  • Members
  • PipPipPipPipPip
  • 3697 posts

Posted 11 February 2011 - 03:08 AM

Second karma point Paul. Using Firebug you should be able to see the graphic and locate it's absolute path with further investigation with the tool. Thanks, Bryan

#6 siso

siso

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 11 February 2011 - 09:55 AM

Thanks for the Karma :)

This is what I see when I hover over that element which is SUPPOSED to have an image there but which I guess doesn't:

Posted Image


I'm definitely not an expert with firebug, so I could be looking in the wrong place -- but as far as I can see, besides that partial link I saw, I really don't know where to look for that absolute path.

Tnx.

#7 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 11 February 2011 - 05:13 PM

I don't think the image is missing I think it just needs some padding added: ` #buddypress-page h3 a.button { padding: 8px 5px; } `

#8 siso

siso

    Advanced Member

  • Members
  • PipPipPip
  • 40 posts

Posted 11 February 2011 - 09:17 PM

*sigh* One of these days I'd like to be able to wrap my head around how you figure these things out. Problem solved. 'twas the padding. Thank-you!