[buddypress-trac] [BuddyPress] #948: CSS improvements for BP 1.1

[buddypress-trac at lists.automattic.com]

#948: CSS improvements for BP 1.1
----------------------------+-----------------------------------------------
Reporter:  oriste           |       Owner:     
    Type:  defect           |      Status:  new
Priority:  minor            |   Milestone:  1.1
Keywords:  css fluid width  |  
----------------------------+-----------------------------------------------
 This is the first time I use the Trac system, so pardon me if this is not
 the correct way to do this. DJPaul at the BP forum suggested to enter this
 as an enhancement ticket. In my humble opinion it should be filed as a
 defect, albeit a minor one, given the fact that perhaps not so many users
 will experience it. Please feel free to set me straight if I made any
 mistakes.

 I'm working with the latest version from trunk (1696) on a WPMU 2.8.4
 base. I like the new default theme very much, especially the fluid width
 aspect of it, but I noticed a few shortcomings which are only visible in
 wide monitors (1920 x 1200). When you resize the browser window to max
 window width, the backgrounds of the header titles do not extend all the
 way as they should. That's because they use a fixed width background
 picture. To remedy that I created 4 new background pictures (based on the
 current ones) and added a few CSS statements to my custom.css file as
 follows:

 {{{
 #third-section .widget,
 #content .page,
 #content .directory-widget,
 #content .directory-listing {
 background: url(../images/el_leftcol_header_bg.gif) top left repeat-x
 !important;
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 }

 #third-section .widget h2,
 .page h2.pagetitle,
 .page h3 {
 background: url(../images/el_leftcol_header_left.gif) top left no-repeat
 !important;
 }

 #third-section .widget_bp_core_welcome_widget {
 background: url(../images/el_welcome_header_bg.gif) top left repeat-x
 !important;
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 }

 .widget_bp_core_welcome_widget h2 {
 background: url(../images/el-welcome_header_left.gif) top left no-repeat
 !important;
 color: #fff !important;
 }
 }}}

 I haven't developed a full fledged site yet, so I don't know if I have
 covered all the eventualities, but the same style overrides could be
 applied to other occurrences where these fixed-width background pictures
 are currently used. You can get the images from the directories mentioned
 above at http://eigenlife.com/wp-content/themes/bp-default/_inc/.
 Ultimately it would be more appropriate (I think) if these changes were
 incorporated in the screen.css file.

-- 
Ticket URL: <http://trac.buddypress.org/ticket/948>
BuddyPress <http://buddypress.org/>
BuddyPress