在我的响应网站中，当我调整网站大小时，图像与文本重叠

Question

这是我用过的css

.fluid {
    clear: both;
    margin-left: 0;
    width: 100%;
    float: left;
    display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}

/* Mobile Layout: 480px and below. */

.gridContainer {
    margin-left: auto;
    margin-right: auto;
    width: 86.45%;
    padding-left: 2.275%;
    padding-right: 2.275%;
    clear: none;
    float: none;
}
#div1 {
position: static;
}
#header {
width: 100%;
position: static;
}
.logo_container {position: static;height: auto;width: 100%;margin-left: 0;clear: both;}
.logo_mvc { 
width:200px;
height:67px;
margin-left: 0;
background-image:url(Images/mvcmbl.png);
}
.logo_gsm {width: 45.0526%;margin-left: 5.2631%;clear: none; height:100px;}
.imageslide {
width:100%;
height:auto;
position: static;
margin-left: 0;
clear: both;
}
.imageslide_gs {width: 23.7288%;
    height: 30px;
    margin-left: 0;
    position: static;
    clear: both;}
.imageslide_content {width: 49.1525%;
    height:30px;
    margin-left: 1.6949%;
    clear: none;}
.imageslide_product {   width: 22%;
    height:30px;
    margin-left: 1.6949%;
    clear: none;
}
.zeroMargin_mobile {margin-left: 0;}
.hide_mobile {display: none;}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

.gridContainer {
    width: 100%;
    padding-left: 1.1625%;
    padding-right: 1.1625%;
    clear: none;
    float: none;
    margin-left: auto;
}
#div1 {
position: static;
}
#header {width:100%;
position: static;
}
.logo_container {
position: static;
height: auto;
width: 100%;
margin-left: 2.5641%;
clear: none;
}
.logo_mvc { 
width: 300px;
height:100px;
margin-left: 0;
background-image:url(Images/mvctab.png);
}
.logo_gsm {
width: 300px;
margin-left: 2.5641%;
clear: none;
height:30px;
}
.imageslide {
    width:100%;
    height:auto;
    position: static;
    margin-left: 0;
    clear: both;
}
.imageslide_gs {
width: 23.7288%;
    height: 30px;
    margin-left: 0;
    position: static;
    clear: both;}
.imageslide_content {
width: 40%;
    height:30px;
    margin-left: 1.6949%;
    clear: none;}
.imageslide_product {
    width: 22%;
    height:30px;
    margin-left: 1.6949%;
    clear: none;
}
.hide_tablet {
display: none;
}
.zeroMargin_tablet {
margin-left: 0;
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {

.gridContainer {
    width: 74%;
    max-width: 1232px;
    padding-left: 0.75%;
    padding-right: 0.75%;
    margin: auto;
    clear: none;
    float: none;
    margin-left: auto;
}
#div1 {
position: static;
}
#header {
width: 100%;
position: static;
}
.logo_container {
margin-left: 0;
position: static;
height: auto;
width: 100%;
clear: both;
}
.logo_mvc {
width: 360px;
height:120px;
float:left;
margin-left: 0;
background-image:url(Images/mvc-logo.png);
}
.logo_gsm {
    width: 200px;
    height:133px;
    float:right;
    margin-left: 1.6949%;
    clear: none;
    background-image:url(Images/grandstreamlogo.png);
}
.imageslide {
    width: 100%;
    height: auto;
    position: static;
    margin-left: 1.6949%;
    clear: none;
}
.imageslide_gs {
    width: 200px;
    margin-left: 1.6949%;
    height:200px;
    position: static;
    clear: none;
}
.imageslide_content {
    width: 49.1525%;
    height:30px;
    margin-left: 1.6949%;
    clear: none;
    text-align:center;
    position:static;
    }
.imageslide_product {
    width: 200px;
    height:200px;
    position:static;
    margin-left: 1.6949%;
    clear: none;
    background-image:url(Images/producstucm.png);
}
.zeroMargin_desktop {
margin-left: 0;
}
.hide_desktop {
display: none;
}
imag{
max-width:100%;
}
}

在此代码中，类“imageslide_product（有图像）”重叠了“imageslide_content”类，一旦开始从桌面到平板电脑视图重新调整网站大小（图片在平板电脑和桌面大小之间重叠在文本中）。

有人可以帮忙吗