As I work on revamping my website, I have decided to incorporate the Bootstrap framework. While I can navigate through HTML coding, I still consider myself a novice when it comes to coding.
The current issue I am facing involves the alignment of two columns of text on smaller screens. The padding within the second column seems to extend beyond the left edge compared to the first column, creating a floating effect even though there are no images involved. Since I am linking to the Bootstrap core via style sheets, direct editing is not an option for me at the moment.
CODE:
#container {width:95%; max-width:900px; margin:0 auto;}
#main-nav {
float:right;
margin-top:-50px;
max-width:500px;
}
#maincontent {width:100%; margin:10px;}
img{width: auto; max-width:105%;}
a img{border:none;}
@media screen and (max-width:1002px) {
.img{width:auto; max-width:80%;}}
@media screen and (max-width: 957px) {
#socialbuttons {margin-top:-45px;}
#container {margin: 30px;}
#container2 {margin:0 50px 10px 50px; width:100%;}
#main-nav {margin-right: 50px;}}
@media screen and (max-width: 820px) {
#container2 {width:80%}}
<div class="wrap" id="maincontent"> <h1>Welcome to Compass Design</h1>
<p class="col-sm-6">Innovative. Targeting. Creative. Effective Branding - keywords every marketing and design agency claims makes them unique. However, when all graphic design companies claim originality, what makes them different from the next? When you need a Graphic Designer or Print and Website Design Services, turn to Compass Design.<br/><br/>
The team at Compass Design believes in creating a visually unique brand and consistent identity for each of their clients. Their philosophy is simple: honest, friendly, and flexible design that works with your current marketing strategy. Don’t have a marketing strategy? No problem! Compass Design will create one just for you.
</p>
</span>
<p><span class="col-sm-6">
Compass Design’s flexible services include custom options, as well as templates you can use on your own. This means there is a service for every budget. Whether your business is just starting out or is already established and just needs a refresh, Compass Design will work with you to reach your marketing goals without breaking the bank.<br/>
<br/>
Contact Compass Design near Rapid City, SD today to find out how they can create the marketing tools you need to catch the attention of your customers and reach your business goals!<br/><br/>
<strong><span style="font-size:1.25em"> Let Compass Design create compelling print graphics and web — call 605-786-6432.</span></strong></span></p>
</div>