Quick CSS Help! For $2.50

Discussion in 'Design' started by Strike X, May 14, 2009.

0
  1. #1
    If you can do this in CSS2, let me know.

    Like this below

    [​IMG]

    Need left rounded corner.
    The rest of borders should: border-xxxx: 2px solid #xxxxx; or something
    It should work on the major browsers including IE 7.

    When I add more content, the height of box should expand itself.
     
    Strike X, May 14, 2009 IP
  2. KingWebDeveloper

    KingWebDeveloper Banned

    Messages:
    39
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    As Seller:
    100% - 0
    As Buyer:
    100% - 0
    #2
    That is css with an image, I'd set up the div and css for you, but I would require more than 2.50 compensation.
     
    KingWebDeveloper, May 14, 2009 IP
  3. Moka

    Moka Well-Known Member

    Messages:
    405
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    108
    As Seller:
    100% - 0
    As Buyer:
    100% - 0
    #3
    Even if u do it in pure css with the option of expanding as height increases and also browser compatible,
    the amount u r proposing is very less.
     
    Moka, May 14, 2009 IP
  4. KnuTz

    KnuTz Well-Known Member

    Messages:
    169
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    Digital Goods:
    1
    As Seller:
    100% - 5
    As Buyer:
    100% - 0
    #4
    try this
    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="en">
<head>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <style type="text/css">
	         *
			 {
			    margin:0;
				padding:0;
			 }
	        .box
			{
			   width:292px;
			}
			.box .box-top
			{
			   width:100%;
			   height:12px;
			   font:2px;
			   background:url('http://img136.imageshack.us/img136/6796/boxtop.png') top left no-repeat;
			}
			.box .box-content
			{
			   border-left:2px solid #e78f8f;
			   border-right:2px solid #e78f8f;
			   border-bottom:2px solid #e78f8f;
			}
			.box .box-content p
			{
			   padding:10px;
			}
 
	 </style>
</head>
<body>
<!--box begin -->
<div class="box">
     <div class="box-top"></div>
     <div class="box-content">
	  <p>
      "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
      </p>
	 </div>
</div>
<!--box end-->
</body>
</html>
    HTML:
     
    KnuTz, May 14, 2009 IP