Buddypress via Platform Pro - a few elements look messy - css fix help
Started by
siso
, Feb 07 2011 10:53 PM
8 replies to this topic
#1
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
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
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
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;
}
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
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
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:


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.
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:


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
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
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!











