Skip to main content
Announcements
See what Drew Clarke has to say about the Qlik Talend Cloud launch! READ THE BLOG
cancel
Showing results for 
Search instead for 
Did you mean: 
singhcv123
Contributor
Contributor

Qliksense Widget gotcha

<!DOCTYPE html>
<html>
<head>
<style>
* {
  box-sizingborder-box;
}

.flex-container {
  displayflex;
  flex-directionrow;
  font-size30px;
  text-aligncenter;
}

.flex-item-left {
  background-colorWhite;
  padding10px;
  flex10%;
  border1px solid black;
  text-aligncenter;
  font-size10px;
  font-family'Times New Roman'Timesserif;
}

.flex-item-center {
  background-colorWhite;
  padding10px;
  flex60%;
  border1px solid black;
  border-left-stylenone;
  text-alignleft;
  font-size10px;
  
}

.flex-item-right {
  background-colorWhite;
  padding10px;
  flex30%;
  border1px solid black;
  border-left-stylenone;
  text-alignleft;
}

.flex-item-center-content {
  background-colorWhite;
  padding10px;
  flex50%;
  bordernone;
  border-left-stylenone;
  text-alignleft;
  font-size10px;
  
}

.flex-item-right-content {
  background-colorWhite;
  padding10px;
  flex30%;
  bordernone;
  border-left-stylenone;
  text-alignleft;
  font-size10px;
}

/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width800px) {
  .flex-container {
    flex-directionrow;
  }
}
</style>
</head>
<body>

<div class="flex-container">
  <div class="flex-item-left">
      <b>Thresold:</b><br>1233

  </div>
  <div class="flex-item-center">
    <div class="flex-item-center-content">
        <b>Info1:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info2:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info3:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info4:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info5:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info6:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info7:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info8:</b>
    </div>
    <div class="flex-item-center-content">
        <b>Info9:</b>
    </div>

  </div>
  <div class="flex-item-right">
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div> 
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>   
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
    <div class="flex-item-right-content">
        <b>Info1:</b>
    </div>  
  </div>
</div>

</body>
</html>
0 Replies