"Add banner"
Bootstrap 4.1.1 Snippet by tieusuquay79

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="en"> <head> <title>HTML</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <!--[if IE]> <link href="~/Content/NewHomePage/all-ie-only.css" rel="stylesheet" /> <![endif]--> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="style.css"> </head> <body> <style> .FlightInline {width: 730px;margin: 0 auto; cursor: pointer; display: flex;background-color: #fff;margin-top:15px;border-radius: 2px;margin-bottom: 15px; border-color: transparent!important;box-shadow: 0 0 2px 0 rgba(19,26,31,0.12),0 2px 4px 0 rgba(19,26,31,0.22)!important;} .FlightInline .content-col {flex: 1;display: flex;padding: 0;border-right: 1px solid #d9e1e8;} .FlightInline .content-col .ss-icon {height: auto; padding: 10px; display: flex; flex-direction: column; justify-content: center;} .FlightInline .content-col .ss-icon img {height: auto;} .FlightInline .content-col .content {padding: 10px; flex: 1;display: flex;flex-direction: column;justify-content: center;} .inlineAdHeadline { font-weight: 500; font-size: 18px;color: #17232c; max-width: 565px; margin-top: -1px; text-overflow: ellipsis; line-height: 21px; padding-bottom: 6px;} .inlineAdDescription {padding-bottom: 0; min-height: initial; font-size: 12px;} .ss-inlineAdFooter {width: 100%; float: left; display: block; margin-top: 5px; color: #186aa5; font-size: 12px;} .ss-sponsoredTag {color: #92aabb; font-family: "Gibson SemiBold",Tahoma,Helvetica,sans-serif; font-weight: 600;} .price-col.ss-right-alignment {align-items: flex-end;justify-content: flex-end; text-align: center;padding-bottom: 12px;width: 175px;padding: 12px;display: flex;} .ss-inlineAdSelect {width: 100%;} .ss-ui-button { display: inline-block; margin: 0; padding: 10px 20px; border: 0; background-image: -webkit-gradient(linear,left top,left bottom,from(#00d775),to(#00bd68)); background-image: -webkit-linear-gradient(top,#00d775,#00bd68); background-image: -o-linear-gradient(top,#00d775 0,#00bd68 100%); background-image: linear-gradient(-180deg,#00d775,#00bd68); background-image: -webkit-gradient(linear,left top,left bottom,from(var(--bpk-button-primary-gradient-start-color,#00d775)),to(var(--bpk-button-primary-gradient-end-color,#00bd68))); background-image: -webkit-linear-gradient(top,var(--bpk-button-primary-gradient-start-color,#00d775),var(--bpk-button-primary-gradient-end-color,#00bd68)); background-image: -o-linear-gradient(top,var(--bpk-button-primary-gradient-start-color,#00d775) 0,var(--bpk-button-primary-gradient-end-color,#00bd68) 100%); background-image: linear-gradient(-180deg,var(--bpk-button-primary-gradient-start-color,#00d775),var(--bpk-button-primary-gradient-end-color,#00bd68)); font-size: 14px; font-weight: 700; text-align: center; text-decoration: none; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #fff; color: var(--bpk-button-primary-text-color,#fff); background-color: #00d775; background-color: var(--bpk-button-primary-background-color,#00d775); border-radius: 20px; } .ss-ui-button:hover, .ui-button:focus {color:#fafafa;text-decoration:none;} .pr-box {margin-bottom:8px;} .prices, .prices:hover {font-size: 24px; line-height: 30px; font-weight: 700; color: #524c61; text-decoration: none;} .spo-badge { display: -ms-inline-flexbox; display: inline-flex; padding: 0 10px; -ms-flex-align: center; align-items: center; background-color: #fb0; border-radius: 2px; margin: 0; font-size: 12px; line-height: 18px; font-weight: 400; letter-spacing: normal; } @media (min-width: 320px) and (max-width: 480px) { } @media (min-width: 481px) and (max-width: 767px) { } </style> <!-- Call TOLL-FREE --> <div class="container-fluid"> <div class="row"> <div class="container"> <div class="row"> <div id="" class="FlightInline"> <div class="content-col"> <div class="ss-icon"> <!--<img alt="" src="images/logo.png">-->Logo </div> <div class="content"> <div class="inlineAdHeadline">Guaranteed lowest fare on flights and Holiday deals!</div> <div class="inlineAdDescription"> <span>Talk to our experts to find best deals for you or get a quote on the airline or hotel of your choice. Book Now!</span> </div> <!-- <div class="ss-inlineAdFooter"> --> <!-- <span> ss | </span> <span class="ss-sponsoredTag">Sponsored</span> --> <!-- </div> --> </div> </div> <div class="price-col ss-right-alignment"> <div class="ss-inlineAdSelect"> <div class="ss-bookitselect"> <div class="spo-pr-wrap"> <span class="spo-badge">Sponsored</span> <div class="pr-box"> <div><a target="_blank" class="prices">₹ 132,567</a></div> </div> </div> <a class="ss-ui-button" href="javascript:void(0)" target="" rel="nofollow"> <div class="view-deal"> View Deal </div> </a> </div> </div> </div> </div> </div> </div> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="custom.js"></script> </body> </html>

Related: See More


Questions / Comments: