Oh dear, one last question, if screen covers large tv’s, then should I have the max-width of 728?
.boxlft, .boxrgt {display:table-cell}
@media screen and (max-width:728px)
Shouldn’t I rather delete that @media?
Also in your example for an image in Images for different screen widths, you gave me:
.banner{
max-width:728px;
min-width:300px;
margin:auto;
}
.banner img{width:100%;height:auto;}
which “is for responsiveness, to make the same image stretch or compress along with the view window.”
BUT what if the screen is below 300px (eg they invent a new pda smaller than iphone) or bigger than 728 (eg tv) - see http://www.websitedimensions.com/ - then does that mean they won’t see the image?
Basically I’m having only two kinds of rows in my theme - one where there’s two table cells side-by-side (eg for logo + social media icons) and one where there’s only one “cell” stretching right across the screen - which could have an image in it, or a subscribe form, or testimonials, or Disqus/Facebook comments, etc.
I’m wondering if I’m doing the right thing making the one-cell row a banner (relabeled “box” in my css, so I have .box and .boxtwo). Should I also make .box/.banner a table cell? and if so, what should I add to this to do that?
.box {display:table; width:100%; table-layout:fixed;}
It needs to scale images, but it also needs to be a container for text.
thank you!