Ahmad Karimi
Ahmad Karimi

Reputation: 1373

Custom padding on a certain break-point in bootstrap

I want the classes slideshow and logform to appear on a single row in large and medium breakpoints. Seems that is done.

The challenge is that I also want my logform class to have a padding top of 200px (custom padding) when the screen is in large or medium size and the padding should go off when the browser goes to small or extra small breakpoints. Does it have any solution?

Here is the code:

<body>
    <div class="container-fluid">
      <div class="row">

        <div class="slideshow col-lg-8 col-md-8 col-sm-12">
          <h1>Hello From H1</h1>
          <p>My name is khan and I am from Afghanistan. I am majoring in computer science in the department of Programming for the good.</p>
        </div>


        <div class="logform col-lg-4 col-md-4 col-sm-6 col-lg-down-100">
          <h1>Hello From H1</h1>
          <p>My name is khan and I am from Afghanistan. I am majoring in computer science in the department of Programming for the good.</p>
        </div>


        </div>
      </div>
  </body>
</html>

Upvotes: 0

Views: 660

Answers (1)

tech2017
tech2017

Reputation: 1806

in your case:

.logform{padding-top:200px}
@media screen and (max-width:760px){
  .logform{padding-top:0px}
}

http://jsfiddle.net/DrSRT/721/

Upvotes: 1

Related Questions