Jump to content


Photo
- - - - -

How to extend the background color (black) of the feature area to entire width


  • Please log in to reply
19 replies to this topic

#1 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 04:51 AM

On an unrelated request ( grin ), what css code do I need to make the feature background color ( black ), extend the full width of the webpage, beyond the feature itself? Thx again. : ) reuben lee

#2 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 06:46 AM

...As well as, do the same for the "header" as well. But just a diff color and/or background. thx.

#3 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 18 February 2011 - 07:15 AM

Which theme are you using?

#4 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 02:13 PM

Pageline Pro Dev (Base)

#5 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 02:31 PM

Sorry. PlatformPRO Dev ed. :)

#6 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts
  • Country: Country Flag

Posted 18 February 2011 - 06:11 PM

Use this CSS in the custom code - custom css box in the PP settings panel `#feature {background:#000;}`

#7 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 09:32 PM

Thx. :) I tried this and all that seems to do is put a black background within the feature section it self, not the whole width of the page where the feature is. Is this a case of having to add an image to the left and right of the feature section? Or? thx again. :)

#8 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 18 February 2011 - 09:34 PM

I want something like this:

Please Login or Register to see this Hidden Content



They are using ur Framework.

Thx. :)

#9 Guest_Guest_*

Guest_Guest_*
  • Guests

Posted 19 February 2011 - 12:09 AM

Are you using the fixed width or full width design? Can we get a link to your page?

#10 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 19 February 2011 - 12:44 AM

Thx. We are using th Full-Width Mode With Canvas. rlb : )

#11 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 19 February 2011 - 06:39 PM

Can we please get a link to your site?

#12 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 20 February 2011 - 08:59 PM

Sure.

Here is the test sites:

Please Login or Register to see this Hidden Content



And this is the effect we want:

Please Login or Register to see this Hidden Content



See where in the feature section the green goes across the whole width of the page in the feature section only.

Thats cool. Thats what we want to do.

thx. : D

#13 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 20 February 2011 - 09:06 PM

Holy Crap! LOL I see what this is....this is how your Eco Theme's CSS is. hmmm....... We are using the Platform Pro (dev) with the Base as active theme. So how can I have our feature section AND NAV section look like the eco feature AND NAV section? I would settle for just the Feature looking that way for now. Is this just a matter of moving the CSS for the feature section from the eco theme? Thanks big time!! :D Reuben Lee

#14 Kate

Kate

    Advocate

  • Members
  • 3039 posts

Posted 21 February 2011 - 01:26 PM

Hi Reuben - Are you sure you don't have it as a fixed width? In the CSS, .fixed_width #page, .fixed_width #footer, and .canvas #page-canvas all have a width of 1020px. So, please check that first. Also, which areas exactly do you want black, please? Behind the picture and the callout?

#15 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 21 February 2011 - 05:49 PM

I'm sure. It says in the in the Design Control: Full-Width Mode With Canvas Also, here is a better page to look at using the feature sliders:

Please Login or Register to see this Hidden Content

I see what this is....this is how your Eco Theme's CSS "Feature" area that we are trying to mimic using a full width in that area. Also i see that eco theme feature area uses images that are attached to the right and left. What do we have t change to allow that effect?

#16 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 21 February 2011 - 05:58 PM

here is screen shot of it showing it.

Please Login or Register to see this Hidden Content

thx. :)

#17 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 21 February 2011 - 07:43 PM

I think I figured it out. Stay tuned!!! :D

#18 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 21 February 2011 - 07:51 PM

hmmm... not quite.... I'm playing around with adding a background image but of course it adds it to the whole site. I just need for certain areas like the ECO theme. hmmmm still working on it.... :D

#19 reubenleeb

reubenleeb

    Member

  • Members
  • PipPip
  • 23 posts

Posted 21 February 2011 - 10:23 PM

Nevermind. :D I got it. I played around with images and CSS. Thx. :)

#20 scottlasak

scottlasak

    Newbie

  • Members
  • Pip
  • 1 posts

Posted 20 March 2011 - 11:24 PM

Anyone care to post how to achieve this full width wrapping for sections like the feature slider? I'm interesting in doing it as well on the Pageline Pro theme. Kind regards!