1

I know it's simple coding, but I think I am overthinking it. Here is what I have for the table info: 

<table width = "1000px" cellspacing = "5">

It looks great on my resolution in all broswers which is 1366 by 768 but on a 1280 by 720 resolution the top background image cuts off. Initially I thought it was the table, but I put a border around it, and it still cut off. It's almost against common sense (in other words, wouldnt you see more of the "lightblue" color background on a larger resolution? Again, I think I am stuck in one mindset and I can't determine why on my widescreen monitor, it covers the screen, but not on a smaller monitor. 

body {
  background-color: lightblue;
  margin: 0;
}


#top {
  width: 100%;
  height: 200px;
  position: relative;
  background-image: url('lightblue.jpg')
}

#bottom {
  width: 100%;
  height: 50%;
  position: relative;
  z-index: -1;
}
steveax
  • 17,527
  • 6
  • 44
  • 59
user1590908
  • 13
  • 5
  • I think I may have determined what my issue is. I created a table with the assumption that this could stop everything from resizing...but if I enter the information which I have divided into 4 blocks into div tags instead and also put in some no wrap tags - I think I may be on the right track . – user1590908 Aug 11 '12 at 18:31
  • I know that if you set the width of the parent to a certain width and nest a 100% inside, any of the divs inside with inherit the actual width (so even if i put 100%...it will only be as wide as the parent). Problem is...that isnt the case. I have 2 divs...and I set the width of the table but that is actually nested in the div...hmm. – user1590908 Aug 11 '12 at 18:33
  • Also, is there any way to include images into jsFiddle? I havent done anything with that site yet, but it looks helpful. – user1590908 Aug 11 '12 at 18:33
  • Are you using tables for layout? Please tell me you don't :) – jao Aug 11 '12 at 19:52
  • 1
    jao, I do. And therein lies my problem lol I'm trying to rectify that right now. – user1590908 Aug 11 '12 at 20:04

1 Answers1

0

Use background image repeat. It might work.

background-repeat:repeat;
some_other_guy
  • 3,364
  • 4
  • 37
  • 55
  • Or the css-3 property `background-size:100%` – jao Aug 11 '12 at 19:53
  • probably not but there seems to be a workaround: http://stackoverflow.com/questions/2991623/make-background-size-work-in-ie – jao Aug 11 '12 at 20:49