Databases
StackOverflow2013
Postsdbo
POCSS Half/Half Background
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS Half/Half Background
    primarykey
    data
    text
    <p>I have searched every where for an answer to this. i have a design that I am trying to code using divs and css. There is a gradient in the top half of the image that goes form left to right and is different colors. The problem I am finding is that I can do it half and half, and I was able to finally get the image to center but part of it is hiding underneath the background. </p> <p>(http://pretty-senshi.com/final-final.html) &lt;-- sample of the design so far</p> <p><a href="http://pretty-senshi.com/original.png" rel="nofollow">http://pretty-senshi.com/original.png</a> &lt;-- the original design</p> <p><a href="http://pretty-senshi.com/gradient.png" rel="nofollow">http://pretty-senshi.com/gradient.png</a> &lt;-- the background gradient that needs to be repeated on the X-Axis only.</p> <pre><code>&lt;html&gt; &lt;LINK href="style.css" type=text/css rel=stylesheet&gt; &lt;/head&gt; &lt;body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"&gt; &lt;div id="container"&gt;&lt;div id="rightHalf"&gt; &lt;/div&gt;&lt;center&gt;&lt;img src="images/Final-Final_02.png" id="picture"&gt;&lt;/center&gt; &lt;div id="header2"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt;&lt;/div&gt; </code></pre> <p></p> <p>And the CSS is:</p> <pre><code>@charset "UTF-8"; /* CSS Document */ body {background: url(images/final-final_01.png); background-repeat:repeat-x;} div#container { width:100%;} picture {z-index: 999;} #rightHalf { background: url(images/final-final_03.png); background-repeat:repeat-x; width: 50%; position: absolute; right: 0px; height: 100%; z-index: 1; } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USHamZa
    1. USprettysenshi
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POCSS Half/Half Background
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POCSS Half/Half Background
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POCSS Half/Half Background
      1. This table or related slice is empty.
      1. VTDownMod
    1. COInstead of z-index: 1 try z-index:-1 on your #rightHalf div.
      singulars
      1. POCSS Half/Half Background
      1. USMarko Francekovic
    2. COI can't believe it was that easy! YES! Thank you! It completely works now!
      singulars
      1. POCSS Half/Half Background
      1. USprettysenshi
    3. COSome things that won't help your problem, but need to be addressed anyway: You should have a doctype declaration. There is no <head> tag, yet you're closing it anyway. If you're using an external stylesheet to begin with, don't add style attributes to your body tag. The center tag has been deprecated for a long time now, try margin: 0 auto; instead. Finally, I'd look into properly nesting and indenting your HTML tags so that they're easy to read. Doing these things will not only make your code function better across browsers, but will also make you look more professional. Hope this helps. :)
      singulars
      1. POCSS Half/Half Background
      1. USScotty C.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload