|
[x]
Posted via EE Mobile
|
|
| Search, ask, and monitor your questions on the go with EE Mobile. Visit Experts Exchange from your mobile device and never be out of touch again. |
|
|
|
|
Asked by splendorx in Cascading Style Sheets (CSS)
I need help with laying out some objects in CSS. I have the page built with the objects in DIV tags, but unable to display the information in the desired format. The web page has a gray box and the objects need to nest inside it. And I am tring to get soccer player image to display behind form. The web page can be viewed here:
http://canikickit2010.com/index.cfmPlease advise on what needs to be changed in the CSS to have content fill grey box and have soccer player image displayed behind form.
Thank you,
Terry
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
|
<style>
body { background-color:#000000;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
color:#000000;
}
.bl {background: url(images/bl.gif) 0 100% no-repeat #DEDEDE; width:auto;}
.br {background: url(images/br.gif) 100% 100% no-repeat}
.tl {background: url(images/tl.gif) 0 0 no-repeat}
.tr {background: url(images/tr.gif) 100% 0 no-repeat; padding:10px; position:relative; height:200px;}
.clear {font-size: 1px; height: 1px}
</style>
<div id="content" style="position: relative; top:30px; width:820px; margin-left:auto; margin-right:auto; padding-bottom:60px; clear:both;">
<div class="bl">
<div class="br">
<div class="tl">
<div class="tr" style="z-index:5;">
<div id="leftCol2" style="float:left; background: url(images/lion.png) 50% 0 no-repeat; width:45%;"><img src="images/blurb.png" width="142" height="40" /><br />
<br />
<cfoutput>
#qGetPageByFileName.page_content#
</cfoutput>
</div>
<div id="rightCol2" style="float:right; width:45%; z-index:5;">
<img src="images/subscribe.png" width="115" height="25" /><br />
<br />
<cfform action="#CGI.SCRIPT_NAME#" method="post">
Please enter your name and email to subscribe to our quarterly newsletter.<br />
<br />
Name: <cfinput type="text" name="subscriber_first_name" required="yes" message="Name is required." />
<br />
<br />
Email:
<cfinput type="text" name="subscriber_email" required="yes" message="Email is required." />
<br />
<br /><input name="submit" type="submit" value="submit" />
</cfform>
</div>
<div id="soccer player" style="position:absolute; z-index:1; top:-20px; left:573px;">
<img src="images/soccer-player.png" width="259" height="275" alt="Soccer Player" />
</div>
</div>
</div>
</div>
</div>
|
20091021-EE-VQP-81 - Hierarchy / EE_QW_3_20080625