I'm working on some CSS and I did notice that there should be something wrong. The CSS works perfect on desktop version and also on my Sony Xperia Z3. However it doesn't do what it should do on my Samsung tablet.
Anyway this is my CSS.
.normal {
background-image: url('halftone.png');
margin: auto;
padding: 5px;
background-repeat: repeat;
min-height: 100px;
}
.normal1 {
background-image: url('halftone.png');
padding: 5px;
float:left;
margin-bottom: 10px;
background-repeat: repeat;
min-height: 100px;
}
.normal2 {
background-image: url('images/bg.png');
margin-bottom: 10px;
width: auto;
padding: 5px;
float:right;
background-repeat: repeat;
min-height: 100px;
}
#bar {
padding: 5px;
margin-bottom: 10px;
color: #FFFFFF;
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: bolder;
font-size: 16px;
text-align: center;
text-shadow: 0px 0px rgba(0,8,33,1.00);
vertical-align: middle;
background-image: url('images/bar.png');
background-repeat: repeat;
width: auto;
}
So it doesn't show up my background-image
But the funny thing is; this code does work
#news {
background-image: url('back.png');
background-repeat: repeat;
padding: 5px;
font-size: 15px;
width: auto;
}
HTML kind looks like
<div class="normal1">
<div id="bar">TITLE HERE</div>
lot's of text
</div>
So any idea what I'm missing?
Also the background-image doesn't show up (which is only a image of kinda 500px x 500px which should repeat, just as the images in the other div's). Only shows the background color.
I get it,
It's because my samsung tablet screen is very "light dark" so dark background colors simply disappear easy.