This question already has an answer here:
My html updates are going through but something is off with the css...
Could it be like a duplicate script in the index.html?
Here is my code I really have no idea what could it be. I am using a block layout for the html page. Is there a bootstrap grid html I could use instead for the 4 block section layout instead? Thanks ahead of time.
// Closes the sidebar menu
$("#menu-close").click(function(e) {
e.preventDefault();
$("#sidebar-wrapper").toggleClass("active");
});
// Opens the sidebar menu
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#sidebar-wrapper").toggleClass("active");
});
// Scrolls to the selected menu item on the page
$(function() {
$('a[href*=#]:not([href=#],[data-toggle],[data-target],[data-slide])').click(function() {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') || location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
//#to-top button appears after scrolling
var fixed = false;
$(document).scroll(function() {
if ($(this).scrollTop() > 250) {
if (!fixed) {
fixed = true;
// $('#to-top').css({position:'fixed', display:'block'});
$('#to-top').show("slow", function() {
$('#to-top').css({
position: 'fixed',
display: 'block'
});
});
}
} else {
if (fixed) {
fixed = false;
$('#to-top').hide("slow", function() {
$('#to-top').css({
display: 'none'
});
});
}
}
});
$(document).ready(function() {
// Test for placeholder support
$.support.placeholder = (function(){
var i = document.createElement('input');
return 'placeholder' in i;
})();
// Hide labels by default if placeholders are supported
if($.support.placeholder) {
$('.form-label').each(function(){
$(this).addClass('js-hide-label');
});
// Code for adding/removing classes here
$('.form-group').find('input, textarea').on('keyup blur focus', function(e){
// Cache our selectors
var $this = $(this),
$parent = $this.parent().find("label");
if (e.type == 'keyup') {
if( $this.val() == '' ) {
$parent.addClass('js-hide-label');
} else {
$parent.removeClass('js-hide-label');
}
}
else if (e.type == 'blur') {
if( $this.val() == '' ) {
$parent.addClass('js-hide-label');
}
else {
$parent.removeClass('js-hide-label').addClass('js-unhighlight-label');
}
}
else if (e.type == 'focus') {
if( $this.val() !== '' ) {
$parent.removeClass('js-unhighlight-label');
}
}
});
}
});
// When the user clicks on <div>, open the popup
function myFunction() {
var popup = document.getElementById("myPopup");
popup.classList.toggle("show");
}#designer .container{
text-align:center;
max-width:450px;
margin:0 auto;
}
#designer .block{
width: 31em;
height:22em;
margin:10px;
display:inline-block;
background:none;
}
#designer .block1{
width: 31em;
height:22em;
margin:10px;
display:inline-block;
background: none;
float: right;
}<section id="designer" class="section-padding">
<div id="container">
<div class="block"><img src="img/evan1.png"></div>
<div class="block1"><h3>Your Designer</h3>
<h4> Evan Braun</h4>
<p>Hailing from The Queen City (Cincinnati, OH), I made my way down to Lexington, Kentucky to pursue a career in Business Management alongside computer science courses at the University of Kentucky. Computer literacy has been an interest throughout my life. Growing up, I developed a passion for it through graphic design and media editing which eventually led me to where I am today - web design.</p>
<p> <b>I've made it my mission statement to not consider a project completed until the customer is 100% satisfied with their product.</b></p></div>
<div class="block">
<h5><span>Experience</span></h5>
<p><i class="fa fa-check-square-o" aria-hidden="true"></i> 3+ Years of programming practice in HTML, CSS, PHP, JQuery, and JavaScript.</p>
<p><i class="fa fa-check-square-o" aria-hidden="true"></i> Trained in SEO & SEM from DreamWalker Social Marketing | Lexington, KY.
<p><i class="fa fa-check-square-o" aria-hidden="true"></i> 5+ Years of graphic design experience in Adobe Photoshop + Illustrator.
<p><i class="fa fa-check-square-o" aria-hidden="true"></i> 0 Clients disappointed.
</div>
<div class="block1">
<h5>I like getting to know my clients personally</h5>
<p>Being a native of Cincinnati and Lexington, I know that many small business owners in the area prefer dealing face-to-face with their service providers. It’s all part of building trust and confidence. It also allows me to get to know your business on a deeper level, and this has a very positive impact on how your website design turns out.<br><br>
Just let me know how you prefer to work when you <a href="#contact">contact</a> me.</p></div>
</div>
</div> <!-- container -->
</section></div>
