Copy link to clipboard
Copied
Hi gang,
So I was updating some content on the contact page but somehow the Testimonials has moved to the bottom, also the contact info. The Testimonials block was right next to the "Our Advantages" And the Contact Info block was next to the "Solutions" on the bottom of the page.
Here is the code for both blocks.
<div class="grid_4 preffix_1">
<h3>Testimonials</h3>
<blockquote>
<p><!--If you are the owner of a SMB (Small-Medium Size Business) You are most likely to have a higher risk of losing your data especially if you are using traditional backup methods. Learn more about Hybrid Cloud Backup Solutions by watching our video below or visit our youtube channel. Still got questions or interested on how we can solve your backup storage needs, <a href="contacts.html">Contact us</a> today. Where local and cloud are combined, now that's Business Continuity. --> Our customers love us since we give them our best service possible and we thank you for choosing us. Don't take our word for it, check out our video below!</p>
</blockquote>
<blockquote class="bq1">
<p>
<p><video width="350" height="240" controls>
<source src="video/Universal IT Technologies.mp4" type="video/mp4"> </video><!--<script src='//player.ooyala.com/v3/ODk0YTE1ZWYwMmMzNDk0Yjk0MDhhNThj'></script><div id='ooyalaplayer' style='width:350px;height:240px'></div><script>OO.ready(function() { OO.Player.create('ooyalaplayer', 'xrN2U5NjE6H4Gruw2fXHh9uwUL72bfoX'); });</script><noscript><div>Please enable Javascript to watch this video</div></noscript></p>--> </p>
</blockquote>
</div>
<div class="grid_3">
<h4>Contact Info</h4>
<address>
<ul class="cont_address">
<li>975 Cobb Place Blvd. Suite 101</li>
<li>Kennesaw, Georgia 30144</li>
<li><a href=">tel no removed</a></li>
<li><a href=com</email address removeda></li>
<li><a href="#">www.universalittechnologies.com</a></li>
</ul>
</address>
</div>
I think it has to do with the css on the grid.
Please assist me putting those blocks where it was before, thanks!
You still have rubbish in amongst the blocks of code. I've cleaned those three sections up, see html code below:
Then add the below css to the end of your style.css file (note the width of 'grid_4Solutions' should be wider than the 50px you have set it to in your post above. I have set it to 350px wide. You can play around with the width as I don't know what the width of the parent container is without raking through all the css and framework css. Set it too wide and the code will break.
.grid_3Co
...Copy link to clipboard
Copied
Some how you have managed to inject a load of <!DOCTYPE declarations into your code blocks for grid_5 and grid_4. I would start by removing those and see if the problem goes away.
<div class="grid_5">
<h4>About Company</h4>
<img src="images/page1_img3.jpg" alt="" class="img_inner fleft">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } A:link { so-language: zxx } -->
<BODY DIR="LTR">
<p>We operate based on these fundamental values. </p>
<p>Customers always come first.</p>
<p>Solving each customer problems by providing SOLUTIONS</p>
<p class="offset__1">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">This company takes great pride in solving data infrastructure, and voice communications issues. </p>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } -->
<BODY DIR="LTR">
<p>We also address the security challenges to small, mid-size business, corporate, education, and government institutions.</p>
<p><a href="about.html" class="link-1">more</a></p>
</div>
<div class="grid_4">
<h4>Solutions</h4>
<ul class="list-1">
<li><a href="#">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"></a>Business Continuity (Hybrid Cloud Backup Solutions) </li>
<li>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } -->Fully managed IT outsourcing </li>
<li>Devices Connectivity </li>
<li><a href="#">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"></a>Ethernet Cable Design and Implementation </li>
<li>CCTV (Closed Circuit Television Installation)</li>
<li>Cloud Managed Services </li>
<li>Design and Implementation </li>
<li>iPhone/iPad screen repair</li>
<li>Residential Services - Computer Repair/Upgrades (PC/Macs), Virus Removal, Wired/Wireless Connectivity</li>
</ul>
</div>
Copy link to clipboard
Copied
Okay, thanks. I did clean up all of the injected doctype code nothing. So i discovered the issue lies within the css. Somehow, most of the grid tags is configured for the entire website, one change, messes up. Don't quite understand why it didn't happened before but it happened. So i changed the names and one by one it fix by itself. However, the issue lies the remaining with the "About " "Solutions"
"Contact" blocks. they are not aligned on the same row like it was before. I'm going to add the codes for each blocks with the css.
Universal IT Technologies LLC Managed IT Service Provider Kennesaw
<div class="grid_5about">begin
<h4>About Universal IT Technologies</h4>
<img src="images/page1_img3.jpg" alt="" class="img_inner fleft">
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">-->
<HTML>
<!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } A:link { so-language: zxx } -->
<BODY DIR="LTR">
<p>We operate based on these fundamental values. </p>
<p>Customers always come first.</p>
<p>Solving each customer problems by providing SOLUTIONS</p>
<p class="offset__1">
This company takes great pride in solving data infrastructure, and voice communications issues. </p>
<HTML>
<!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } -->
<BODY DIR="LTR">
<p>We also address the security challenges to small, mid-size business, corporate, education, and government institutions.</p>
<p><a href="about.html" class="link-1">more</a></p>
</div>
<div class="grid_4Solultions">
<h4>Solutions</h4>
<ul class="list-1">
<li><a href="#">
</a>Business Continuity (Hybrid Cloud Backup Solutions) </li>
<li>
<!-- @page { margin: 0.79in } P { margin-bottom: 0.08in } -->Fully managed IT outsourcing </li>
<li>Devices Connectivity </li>
<li><a href="#">
</a>Ethernet Cable Design and Implementation </li>
<li>CCTV (Closed Circuit Television Installation)</li>
<li>Cloud Managed Services </li>
<li>Design and Implementation </li>
<li>iPhone/iPad screen repair</li>
<li>Residential Services - Computer Repair/Upgrades (PC/Macs), Virus Removal, Wired/Wireless Connectivity</li>
</ul>
</div>
<div class="grid_3Contact">
<h4>Contact Info</h4>
<address>
<ul class="cont_address">
<li>975 Cobb Place Blvd. Suite 101</li>
<li>Kennesaw, Georgia 30144</li>
<li><a href="tel:7707020270">(770) 702-0270 </a></li>
<li><a href="#">service@universalittechnologies.com</a></li>
<li><a href="#">www.universalittechnologies.com</a></li>
</ul>
</address>
</div> stop
css:
.grid_3Contact {
width: 220px;
}
.grid_4Solultions {
width: 50px;
}
.grid_5about {
width: 470px;
}
Thanks.
Copy link to clipboard
Copied
You still have rubbish in amongst the blocks of code. I've cleaned those three sections up, see html code below:
Then add the below css to the end of your style.css file (note the width of 'grid_4Solutions' should be wider than the 50px you have set it to in your post above. I have set it to 350px wide. You can play around with the width as I don't know what the width of the parent container is without raking through all the css and framework css. Set it too wide and the code will break.
.grid_3Contact {
width: 220px;
}
.grid_4Solultions {
width: 350px;
}
.grid_5about {
width: 470px;
}
<!-------------CLEANED UP BLOCKS OF CODE START BELOW------------------>
<div class="container">
<div class="row">
<div class="grid_5about">
<h4>About Universal IT Technologies</h4>
<img src="https://universalittechnologies.com/images/page1_img3.jpg" alt="" class="img_inner fleft">
<p>We operate based on these fundamental values. </p>
<p>Customers always come first.</p>
<p>Solving each customer problems by providing SOLUTIONS</p>
<p>This company takes great pride in solving data infrastructure, and voice communications issues. </p>
<p>We also address the security challenges to small, mid-size business, corporate, education, and government institutions.</p>
<p><a href="about.html" class="link-1">more</a></p>
</div>
<!-- end grid_5about -->
<div class="grid_4Solultions">
<h4>Solutions</h4>
<ul class="list-1">
<li><a href="#">
</a>Business Continuity (Hybrid Cloud Backup Solutions) </li>
<li>Fully managed IT outsourcing </li>
<li>Devices Connectivity </li>
<li><a href="#"></a>Ethernet Cable Design and Implementation </li>
<li>CCTV (Closed Circuit Television Installation)</li>
<li>Cloud Managed Services </li>
<li>Design and Implementation </li>
<li>iPhone/iPad screen repair</li>
<li>Residential Services - Computer Repair/Upgrades (PC/Macs), Virus Removal, Wired/Wireless Connectivity</li>
</ul>
</div>
<!-- end grid_4Solultions -->
<div class="grid_3Contact">
<h4>Contact Info</h4>
<address>
<ul class="cont_address">
<li>975 Cobb Place Blvd. Suite 101</li>
<li>Kennesaw, Georgia 30144</li>
<li><a href="tel:7707020270">(770) 702-0270 </a></li>
<li><a href="#">service@xxxxxxxxxxxxxxxxxxxxxx.com</a></li>
<li><a href="#">www.universalittechnologies.com</a></li>
</ul>
</address>
</div>
<!-- end grid_3Contact -->
</div>
<!-- end row -->
</div>
<!-- end container -->
Copy link to clipboard
Copied
Hi, the rubbish has been thrown away and dumped in the dumpster, thanks! It wasn't working properly on Chrome until I cleared the cache. Much appreciated again!