How to add something under two columns

[Chrisj]

In the php script that I'd like to modify, it has a left and right column. Underneath these columns, I'd like to add a box for text and images, all the way across the web page, under the two columns.

 

This code below shows the content part of the script page (the header and footer are in another file).

 

I would imagine, to do this, I need to add some code under <!--End Right Column--> correct? Can you provide some basic code which would add a box that streches across the web page under the left column and right column?

Any help would be appreciated. Thanks.

 

<!--Begin Left Column--><title>ads</title>
<div id="column-left-1">
  
</div>
<!--End Left Column-->

<!--Begin Right Column-->
<div id="column-right-1">
  <!--Begin Login Box-->
  <div id="login-box">
    <!--[onload_300;block=div;when [var.show_login_box]=1;comm]-->
    <form action="login.php" method="post" accept-charset="UTF-8" class="middletext">
      <ul>
        <li><label><font class="font4_13">[var.lang_user_name]:</font></label><span class="username"><input type="text" name="user_name_login" size="16" style="width:138px;" /></span></li>
        <li> </li>
        <li><label><font class="font4_13">[var.lang_password]:</font></label><span class="password"><input type="password" name="password_login" size="16" style="width:138px;" /></span></li>
        <li> </li>
        <li>
          <label><font class="font4_13">[var.lang_how_long]:</font></label>
          <span class="howlong">
            <select name="cookie_time">
              <option value="1440">[var.lang_1_day]</option>
              <option value="10080">[var.lang_1_week]</option>
              <option value="43200">[var.lang_1_month]</option>
              <option value="-1" selected="selected">[var.lang_forever]</option>
            </select>
          </span>
          <input type="submit" value="[var.lang_login_now]" class="button-form" />
        </li>
        <li> </li>
        <li>
          <a href="login.php">[ [var.lang_password_reminder] ]</a> <b>|</b> <a href="[var.register_menu_link]">[ [var.lang_register_today] ]</a>
          <input type="hidden" name="submitted" value="yes" />
          <input type="hidden" name="remember_me" value="remember_me" />
        </li>
      </form>
    </ul>
  </div>
  <!--End Login Box-->

  
  <!--End Site Stats-->
</div>
<!--End Right Column-->

[Ken2k7]

Do you need PHP to add those text and images?

[Chrisj]

Thanks for your reply.

 

I thought I did. What would you suggest?

[redarrow]

learn html i say.

[Chrisj]

I'm learning it now and asking questions along the way.

And specific code help would be appreciated. thanks

[Ken2k7]

Text - just type it

Image - use the IMG tag. Google it.

[redarrow]

Add the css to the page, so we no what your doing.

 

<IMG SRC='image_name.jpg' title=' ' />

 

[Ken2k7]

<IMG SRC='image_name.jpg' title=' ' />

That's not xHTML-compliant. You're missing the alt attribute.

[Chrisj]

Thanks for your help. Here is the CSS titled Styles (there is another called thickbox):

 

** tyle */

.video_box_main { border:0px solid #00FFFF; font-family: Verdana; color: #333333; font-size: 12pt }

.default_text_white { font-family: Arial; font-size: 10pt; color: #FFFFFF }

.default_text_white_11pt { font-family: Arial; font-size: 11pt; color: #FFFFFF; background-image:url('../images/box_blue_middle.jpg'); background-repeat:repeat; height:25; font-weight:bold }


.default_text_blue { font-family: Arial; font-size: 10pt; color: #3366CC; text-decoration:none }

.default_menu_blue {font-family: Arial; font-size: 10pt; color:#3366CC ;}
.default_menu_blue A { text-decoration:none; font-size: 10pt; color:#3366CC ;}
.default_menu_blue A:visited {font-size: 10pt; color="#3366CC"}
.default_menu_blue A:hover {font-size: 10pt; color="#3366CC"}
.default_menu_blue A:active {font-size: 10pt;}

.default_menu_white {font-family: Arial; font-size: 10pt; color:#ffffff ;}
.default_menu_white A { text-decoration:none; font-size: 10pt; color:#ffffff ;}
.default_menu_white A:visited {font-size: 10pt; color="#ffffff"}
.default_menu_white A:hover {font-size: 10pt; color="#ffffff"}
.default_menu_white A:active {font-size: 10pt;}

.default_menu_gray {font-family: Arial; font-size: 10pt; color:#333333 ;}
.default_menu_gray A { text-decoration:none; font-size: 10pt; color:#333333 ;}
.default_menu_gray A:visited {font-size: 10pt; color="#333333"}
.default_menu_gray A:hover {font-size: 10pt; color="#333333"}
.default_menu_gray A:active {font-size: 10pt;}


.default_menu_gray_12pt {font-family: Arial; font-size: 12pt; color:#333333 ;}
.default_menu_gray_12pt A { text-decoration:none; font-size: 12pt; color:#333333 ;}
.default_menu_gray_12pt A:visited {font-size: 12pt; color="#333333"}
.default_menu_gray_12pt A:hover {font-size: 12pt; color="#333333"}
.default_menu_gray_12pt A:active {font-size: 12pt;}


.default_text_blue_8pt { font-family: Arial; font-size: 8pt; color: #3366CC }

.default_text { font-family: Arial; font-size: 10pt; color: #333333 }

.default_text_9pt { font-family: Arial; font-size: 9pt; color: #333333 }

.default_text_8pt { font-family: Arial; font-size: 8pt; color: #333333 }

.default_text_shaded_gray1_8pt { font-family: Arial; font-size: 8pt; color: #333333; background-color:#F0F1FF }


.table_ads_l_b_r_t {border:1px solid #C0CEEF; }


.table_border_l_b_r_t {border:1px solid #C0CEEF; }
.table_border_l {border-left: 1px solid #C0CEEF; }
.table_border_r {border-right: 1px solid #C0CEEF; }
.table_border_t {border-top:1px solid #C0CEEF; }
.table_border_l_r {border-left: 1px solid #C0CEEF; border-right: 1px solid #C0CEEF;}
.table_border_l_b_r {border-left: 1px solid #C0CEEF; border-right: 1px solid #C0CEEF; border-bottom: 1px solid #C0CEEF}
.table_border_l_t_r {border-left: 1px solid #C0CEEF; border-right: 1px solid #C0CEEF; border-top: 1px solid #C0CEEF}
.table_border_t_l_b {border-left: 1px solid #C0CEEF; border-top: 1px solid #C0CEEF; border-bottom: 1px solid #C0CEEF}
.table_border_t_r_b {border-right: 1px solid #C0CEEF; border-top: 1px solid #C0CEEF; border-bottom: 1px solid #C0CEEF}


.warning_box_red {border: 1px solid #FF4242; background-color:#FFDDDD;}
.warning_box_green {border: 1px solid #87CC33; background-color:#DDEECC;}
.warning_box_green_white {border: 1px solid #87CC33; background-color:#FFFFFF;}

[Ken2k7]

Nah that's okay. We, or should I say everyone except redarrow, don't really care for your CSS because your problem isn't in your CSS.

 

Is this solved or do you need further assistance?

[Chrisj]

I need assistance  please.

[Ken2k7]

With what? Just type the text where you want it. Exactly where you want it. As for the image, just do what redarrow posted.

 

Give it a try. You won't get any errors with HTML. Layout may be messed up if you messed up a quote, but that's it.

[Chrisj]

Thanks for your reply.

 

I did just type some text, and it just shows up under the right column.

 

Can you provide some basic code which would add a box that streches across the web page under the left column and right column, from the left to right? Thanks

 

[Ken2k7]

Create a DIV with width set to 100%?

[Chrisj]

Thanks for your reply.

 

Can you show me what that might look like, so I get it correct?

Thanks

[Ken2k7]

You know as a rule of thumb, you should try it out, post what you have and then we correct you.

 

Read the now update forum rules #12 - http://www.phpfreaks.com/page/rules-and-terms-of-service#toc_forum_rules

[redarrow]

 

 

Have a look at this for a clue .....

 

<html>

<head>

<style type="text/css">

div.header{
margin-left: auto;
margin-right: auto;
width: 800px;
text-align: center;
color: #FF0000;
font-weight: bold;
font-size: 60px;
border-style: solid;
border-color: #000000;
}

form.form{
margin-top: 100px;
margin-left: auto;
margin-right: auto;
width: 300px;
text-align: center;
border-style: solid;

}

div.color{
font-weight: bold;
color: 00CCCC;
}

div.warn{
font-weight: bold;
color: #FF0000;
}

select.color{
font-weight: bold;
color: #00CCCC;
}

</style>


</head>


<body>

<div class="header">My web site for the wicked!</div>



<form class="form" method="post" action="<?php $_SERVER['PHP_SELF']; ?>">
<div class="color">Username.
<br>
<input type="text" name="username"> 
<br><br>
Password.
<br>
<input type="password" name="password">
<br><br>
<div class="warn">How long to stay logged in.</div>
<br>
<select class="color" name="time_logged_in">
<option value=" ">Select one</option>
<option value="1440">One day</option>
<option value="10080">One week</option>
<option value="43200">One month</option>
<option value="-1">Forever</option>
</select>
<br><br>
<input type="submit" name="submit" value="login!">
</form>
</div>

<br><br>

<?php

$images_array=array(

"http://tbn2.google.com/images?q=tbn:IPBWQUR0aNtbHM:http://www.playbill.com/images/photo/w/i/wicked2_1079629188.jpg",

"http://tbn1.google.com/images?q=tbn:eGspt1opkMCaNM:http://www.essendonfc.com.au/images/08/wicked1-l.jpg",

"http://tbn2.google.com/images?q=tbn:n_UijOeyiyfQ7M:http://www.harmerpr.com/prgeurope/photos/wicked_91a.jpg",

"http://tbn3.google.com/images?q=tbn:sfT3CaGpn8J5lM:http://images.fanpop.com/images/image_uploads/Wicked--The-Musical-wicked-257205_800_600.jpg"

);

foreach($images_array as $images){

echo "<img height='70px' width='70px'src='$images'>\n";
}

?>

</body>

</html>

[Ken2k7]

redarrow, you can't assume someone runs PHP on their server. But I guess that's what he gets for posting in the wrong forum. Hehe...

[redarrow]

no your correct, he should read a book or use the net silly billy lol.