Jump to content


Photo
- - - - -

header image trough header+content

header image selector css z-index

  • Please log in to reply
3 replies to this topic

#1 helvetik_a

helvetik_a

    Advanced Member

  • Members
  • 99 posts
  • Locationrome - italy
  • Framework Version:2.3.5
  • Country: Country Flag

Posted 18 May 2013 - 11:37 AM

Hi,

I need to center my background image behind the navigation and content. I tried with this code:

 

#branding .content {
   <span class="searchlite">background</span>-<span class="searchlite">image</span>: url('

Please Login or Register to see this Hidden Content

');
   <span class="searchlite">background</span>-position: center;
   <span class="searchlite">background</span>-repeat: no-repeat;
   <span class="searchlite">background</span>-height:600px;
   <span class="searchlite">background</span>-width: 995px;
   <span class="searchlite">background</span>-left: 300px ;
   }

But the image remains cutted of. I use a full width layout and it has to be responsive. I tried also with a z-index position...but it did not work out....

Can you help me?

Thx Corina

 

My site:

 

Please Login or Register to see this Hidden Content

 

How it has to be...

 

 

 



#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 18 May 2013 - 04:37 PM

Hi Corina,

 

The CSS you're using is incorrect. It mixes stylesheet CSS with inline CSS, which is not the best way to achieve results.  I'll recommend you study the resources here to learn more about CSS: 

Please Login or Register to see this Hidden Content

 

You should apply the background to the site using our internal settings, found at Dashboard > PageLines > Site Options > Color Control.  There, you can upload a background image, without CSS, and set the vertical alignment and horizontal alignments correctly, without custom coding.

 

As for the brand logo, that will require some CSS, but the method of doing that is probably best achieved with a plugin we offer called Sexy Snips, found in Dashboard > PageLines > Store > Plugins > Top Free.  Just install and activate it, and Sexy Snips will provide you with the CSS to center a branding image.



#3 helvetik_a

helvetik_a

    Advanced Member

  • Members
  • 99 posts
  • Locationrome - italy
  • Framework Version:2.3.5
  • Country: Country Flag

Posted 20 May 2013 - 08:16 AM

Hi Rob. Thx for your response.

Css is not a problem, i'll correct the code...I tried before the background image option, but i do not liked it at all. Infact, it is not a usual background...more a header background entering in the content area.

when i scroll down the page, the bg-image has to scroll up and to disappear and with this method i did not found out the css selectors of the background...

I will try with the sexy snips and let you know.

 

Thx

Corina



#4 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 20 May 2013 - 02:02 PM

Keep us posted and let us know if you need more help.







Also tagged with one or more of these keywords: header image selector, css, z-index