I am trying to make some web page as show in image .I am able to make almost 90%.But I have one issue
- how to make square as shown in image (a square which have triangle in bottom.I know we can make square using border .but how to make triangle in that bottom triangle
- how to make contend scrollable mean my contend it not scrolling I already use overflow:auto and scroll
)
.bg {
background: #597A4D!important;
width: 100%!important;
}
.nav_bar {
background: #597A4D!important;
border-style: none;
height: 44px;
border: 0px!important;
border-radius: 0px!important;
}
.display_menu li a{
font-size: 1.2em!important;
color: #ffffff!important;
}
ul.display_menu li:last-child{
background:#3C86D7;
}
.rowClass {
display: block;
margin-top: 3%;
}
.rowClass >div {
padding: 3em;
text-align: center;
}
.text_row div{
display: block;
border: 1px ;
padding: auto;
color: #ffffff;
margin-top: 3%;
}
.rowClass span {
display: block!important;
color: #ffffff;
}
.logo_image{
width: 60px;
height: 60px;
}
.email_div label {
color: #ffffff;
font-weight: bold;
text-align: center;
}
.email_div{
width: 50%;
margin: auto;
}
.email_div label {
}
.email_div input {
background: transparent;
border: 1px solid #3C86D7;
display: inline;
width: 50%;
}
.email_div button {
display: inline;
}
.wrapper{
overflow: auto!important;
overflow: scroll!important;
}
Here is my plunker: http://plnkr.co/edit/G8mp53rQlF562hEkgmgT?p=preview
2
Answers
just do this
or desired height instead of
it will start scrolling because it will only scroll if data is overflowing
and for shape this article may help but you don’t need to use any thing just use bootstrap tooltip
Try this for the overflowing
}
to get an idea to make those box with shapes,
See this DEMO