Viewing 2 posts - 1 through 2 (of 2 total)
-
AuthorPosts
-
April 10, 2015 at 11:40 am #426492
I created a text box, then I added some classes to style a rounded corner, shaded box with 3 columns. I added a border to the right. The last column also has a right border, and I understand why, but I can’t think of another way of doing it without using tables. Can someone help make a better box with rounded corners and 3 columns with a border dividing the two middle sections?
Quick CSS code:
.sb-container { border: 2px solid #000 ; border-radius: 20px ; padding: 20px ; background-color: #E3E3E3; color: #79afdd ; width: 760px ; height:200px; margin-left: auto ; margin-right: auto ; } .sb-container div { height: auto; border-right: 1px #47aa42 solid; } .sb-header { text-align: center; } .sb-column-left { width: 28%; /* left: 0; */ background: #E3E3E3; position: absolute; padding-right: 0px; } .sb-column-center { width: 28%; background: #E3E3E3; margin-left: 29%; position: absolute; padding-right: 5px; } .sb-column-right { width: 28%; margin-left:58%; position: absolute; background: #E3E3E3; padding-right: 5px; }
Code in text box:
<div class="sb-container"> <h3 style="text-align: center;"><span style="color: #47aa42;">QUICK FACTS</span></h3> <div class="sb-column-left">FDA Class II clearance for use in active patient monitoring and primary and secondary Alarm Management <a title="Cardiopulmonary Corp. Receives Additional FDA 510(k) Class II Clearance Broadening Bernoulli® Enterprise’s Indications for Use with Medical Devices" href="http://tsgaz.net/bernoulli/cardiopulmonary-corp-receives-additional-fda-510k-class-ii-clearance-broadening-bernoulli-enterprises-indications-for-use-with-medical-devices/">>></a></div> <div class="sb-column-center">Top-rated in customer satisfaction with reporting and analytics in KLAS Alarm Management Report 2014<a title="Performance Score" href="http://tsgaz.net/bernoulli/solutions/alarm-management#performance">>></a></div> <div class="sb-column-right">Overall performance score of 90.1 from healthcare providers in KLAS Alarm Management Report 2014 <a title="Performance Score" href="http://tsgaz.net/bernoulli/solutions/alarm-management#performance">>></a></div> </div>
http://tsgaz.net/bernoulli/solutions/medical-device-integration/
Thanks for any help you can give.
-Fred
April 10, 2015 at 12:41 pm #426522 -
AuthorPosts
Viewing 2 posts - 1 through 2 (of 2 total)
- You must be logged in to reply to this topic.