Add an URL to the background?

• 

  thesacredpath · Member · Nov 30, 2011 at 6:29 pm

  • Copy link

  Here is one of the problems. When you narrow or widen your browser window, the background image disappears (try it). The image widget is staying “fixed” in relationship to the left side and top of the browser window. That means the clickable area, when someone has their browser window narrowed, comes over the top of the content. The content can certainly be set so that it will always be on top of the clickable area, but the clickable area cannot be fixed in relationship to the background image.

  The following will keep the main content above the image widget. It will not however solve the issue of the clickable area moving in relationship to background image. Add the following and then play around with your browser width.

  #main {
  position: relative;
  z-index: 1000;
  }

• 

  portableplaying · Member · Nov 30, 2011 at 6:33 pm

  • Copy link

  Thank you very much! It works!
  It’s great!

  I will think about that issue you mentioned. But now all my questions are solved :)

• 

  thesacredpath · Member · Nov 30, 2011 at 6:34 pm

  • Copy link

  You could change the background position in #wrapper to left top and then the background and the widget would keep their positions relative to one another.

  background-position: left top;

• 

  thesacredpath · Member · Nov 30, 2011 at 6:36 pm

  • Copy link

  You are welcome.

  And check in several browsers if you can to make sure things function in all of them. IE in particular can be finicky.

• 

  portableplaying · Member · Nov 30, 2011 at 6:46 pm

  • Copy link

  Just got one last question^^

  Now you can click on the posts, but you can not klick on the other widgets (like the serach button). I tried to arrange them also with the z-index; but this does not work

• 

  thesacredpath · Member · Nov 30, 2011 at 7:14 pm

  • Copy link

  Hmmm, I can click on all the widgets and on the slider stuff with no problem. Let’s do the position relative and z-index to the following two selectors as well and see where that gets us.

  #sidebar {
  position: relative;
  z-index: 1000;
  }
  
  #header-wrap {
  position: relative;
  z-index: 1000;
  }

• 

  portableplaying · Member · Nov 30, 2011 at 11:43 pm

  • Copy link

  Works again. :-)

  Thank you for the great support.

• 

  thesacredpath · Member · Dec 1, 2011 at 1:49 am

  • Copy link

  You are welcome.