Problem with style sheet for Projects in front end
Tareq Hasan
10 years, 1 month ago| Author | Posts |
|---|---|
March 18, 2014 at 9:06 pm 16866 | |
| Tareq Hasan | Hello, I have the front end operational and have been working with it. Functionally, everything is going ok, but I have a style sheet issue that I can't figure out. In the Project Dashboard, there are icons for the users assigned to the project - avatars, I suppose. On both Safari and Firefox they are out of place. On Safari, they are scaled and distorted. On Firefox, they are shifted out of alignment from the project tile. I am using a theme in Wordpress called Enfold, which is a purchased theme, if that matters. Thanks |
March 18, 2014 at 9:50 pm 16872 | |
John
| I think I found the issue. This may be something you want to update / fix. I am using Enfold theme in WordPress. The FrontEnd stylesheet doesn’t control the layout for the gravatars as they are placed on the project tiles. That style definition is coming from the main WP Project Manager style sheet for the Admin layout. In Admin, the layout is great, but in FrontEnd, the gravatars are a mess. I removed this section of code from the admin.css “.cpm-projects .cpm-project .cpm-project-people { This completely fixed the layout issue in the front end. Gravatars are aligned inside the project Tile. I may play around with it and see if I can get them aligned near the bottom of the tile, but at least it tells me where the distortion is coming from. Could you guys elaborate on what’s happening here? Most people won’t be using stock themes in WordPress, so it’s critical to know how to quickly fix style sheet issues like this. Thanks! |
March 19, 2014 at 11:04 am 16892 | |
Tareq Hasan
| It’s kind of impossible to guess the situations like this as there are thousands of themes and to make it compatible with everyone one them. The frontend uses the admin sides css and also some overrides from the frontend css. So you could write css to the frontend plugins style.css or even override them from your themes style.css |
