- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘Other’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi, I wanted to know if my grid of 6 boxes , is as responsive as possible ?
When I look at my front page in my Ipad for example ( or when I shrink my window size) , it seems like the first 3 boxes in the first row flow good, but then there is one box in the middle followed by two. So the 2nd row is not flowing good ? I can post my code on how I made the six box’s, if firebug is not enough for anyone to help me.
Thank you for any help.
My front page: http://bitfiu.com/
I tried the following in firebug, but I noticed that when the screen shrinks (with the .homecont-box
set at px ) the words dont stay inside and over flow out of its white container, but if i set it at anything else or just include a max or min height it does not look right.
The white container box
.homecont-box {
background-color: #fbfbfb;
border: 1px solid #eee;
border-radius: 0 0 5px 5px;
height: 235px;
margin: 0 1%;
transition: all 0.5s ease 0s;
}
The fontawesome icon
.tabstyle-one {
color: #444;
display: block;
font-size: 45px;
margin: 23px 5px 5px;
text-align: center;
}
The header in the box
.hometext-boxhead {
clear: left;
color: #333;
font-family: "Open Sans",sans-serif !important;
font-size: 24px;
font-weight: 400;
line-height: normal;
margin: 0 auto;
padding-bottom: 5px;
text-align: center;
width: 100%;
}
The paragraph of text in the box
span.hometext-boxp {
clear: left;
color: #666;
display: table-cell;
font-family: "Open Sans",sans-serif !important;
font-size: 18px;
font-weight: 300;
height: 100%;
margin: 0;
overflow: auto;
padding: 0 30px;
width: 100%;
}