Tagged: , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • October 16, 2015 at 3:04 pm #520025
    richardelectrix

    Hi

    I am using this code on my responsive specification table

    @media only screen and (max-width: 414px) { 
div table.shop_attributes td {
    display: initial;
    position: relative;
    left: -250px;
    top: 25px;
    text-align: center;
}
div table.shop_attributes th {
    /* width: 225px; */
    min-width: 250px;
    text-align: center;
    padding-top: 5px;
}
div table.shop_attributes td p {
    /* width: 76px; */
    min-width: 250px;
    text-align: center;
    padding-bottom: 10px;

}}

    It is working pretty well on Mobile portrait, but as soon as I turn it to landscape it picks up the desktop design which is fine.

    But there is a section between 414px media and desktop where it doesnt look right. Ideally the table should stretch full width of the tab but it is sticking to the 250px wide.

    http://screencast.com/t/CuSHP5NitR

    how can I get it to not be a set 250px wide?

    October 16, 2015 at 5:16 pm #520167
    Elliott

    Hi richardelectrix!

    Increase the 414px.

    @media only screen and (max-width: 414px) {

    Regards,
    Elliott

    October 16, 2015 at 9:11 pm #520298
    richardelectrix

    Hi

    I have tried doing that.

    The table stays the same width but the tab size grows correctly.

    The table should grow with the tab but it stays at a set width.

    October 19, 2015 at 5:55 pm #521097
    Elliott

    Hey!

    Not sure what you mean. Take a screenshot and highlight what your seeing.

    Regards,
    Elliott

    October 20, 2015 at 10:40 am #521473
    richardelectrix

    Hi

    There are a few issues …

    1) The TR extends beyond the width of the tab, therefore (more noticable on the ALT TR) the white goes to the right edge of the tab instead of leaving an equal border before the edge of the tab (as per the left).

    2) The text is touching the border

    3) When you make the screen wider, the table doesnt grow in width (it stays at a fixed width).

    http://dev2.electrixinternational.com/product/flat-roof-push-button-enclosure-22-5-mm-holes/

    http://screencast.com/t/xFoPs2VR

    October 20, 2015 at 9:48 pm #522021
    Elliott

    Hey!

    Hmm, not really sure I understand what’s going on there. It looks like you have quite a bit of CSS customization going on. It would probably be best if you hired a freelancer to help you out with customizing your site.

    Regards,
    Elliott

    October 21, 2015 at 5:35 pm #522394
    richardelectrix

    Hi

    I think it is to do with the min-width.

    It is extremely close.

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Responsive specification table’ is closed to new replies.