Jump to content

Formatted Text Problem.

Wstar

By Wstar
in PHP Coding Help

 Share

Recommended Posts

Wstar Member

Wstar

Posted
Posted

I'm having some issues with having formatted text displaying.  Colors, new lines, and other spacing work just fine.  Its just bullets that are the problem.

 

Problem:

http://scotthermanfitness.com/articles.php?Rid=51

 

Code:

						// setup news query
							$query = "SELECT * FROM articles 
		  			          WHERE id = '$Rid' 
							  LIMIT 1";

							// send query off
							$sth    = execute($query, 1);
							$ref 	= fetch_array($sth);

							// get data
							$id  			= $ref['id'];
							$date  			= $ref['date']; 
							$cat  			= $ref['cat']; 
							$title  		= $ref['title']; 
							$content    	= stripslashes($ref['content']);
							$author  		= $ref['author']; 


							// check to see who wrote the article, if brian
							if ($author == '0') {
								echo '<tr><td align="center"><div id="about_header">Brian McKay: <br>Exercises Physiologist</div></td></tr>';
							} else { // if scott
								echo '<tr><td align="center"><div id="about_header">Scott\'s Words of <br>Wisdom</div></td></tr>';
							} // END if ($author == '0') {

							// convert mysql date to a more readable format
							list($yr,$mon,$day) = split('-', $date); 							
							$display_date = date('F j, Y', mktime(0,0,0,$mon,$day,$yr)); 

							// see if there is a category
							if (strlen($cat) > 0 ) {
								$cat_string = 'Category: ' . $cat;
							} else {
								$cat_string = 'Category: General ';
							} // END if (strlen($cat) > 0 ) {

							// display the header
							echo '<tr><td><div id="exercise_list">' . $title . '<br>' . $display_date . '  ' . $cat_string . '</div><br></tr></tr>';
							echo '<tr><td>' . nl2br($content) . '</td></tr>';

							// end table and div containter
							echo '</table></div>';

 

ul li ol{
margin-left: 20px;
padding-left: 20px;
list-style: inside;
list-style-position:inside;
}

 

I just need the bullets to display correctly, inside the content box.  If I "View Source" for the page and copy the contents into another page, it works great.  I just can't find out the issue.

Link to comment
Share on other sites
Wstar Member

Wstar

Posted
  • Author
Posted

the list tags are in $content which gets displayed.

 

This is what is in the $content...

 

What is this!<br><br><ol><li>Hello</li><li style="color: rgb(153, 0, 0);">THis</li><li>is</li><li><span style="color: rgb(0, 0, 153);">me</span>!</li></ol>This<br>   is a<br><br>       space

 

If you look at http://scotthermanfitness.com/articles.php?Rid=51 you can see the bullets (or numbers) show, they are just outside the text area.

Link to comment
Share on other sites
teamatomic Newbie

teamatomic

Posted
Posted

Just on a quick look of your page source and your css file it might be that your css bit for the list is being over-ridden by the float:left of the content. Try putting the css for the list at the bottom of the file, that is after the css for the content id. Also, I see in your table row that holds the exercise_list div that you have a double </tr></tr>, it might or might not have any effect on what is happening.

 

 

HTH

Teamatomic

Link to comment
Share on other sites
Wstar Member

Wstar

Posted
  • Author
Posted

I moved the CSS to the list at the bottom with no luck.  I also fixed the table issue.  The bullets are still not displaying correctly.  They are outside the box, yet the text is correct.

 

Again, here is an example:  http://scotthermanfitness.com/articles.php?Rid=51

 

My full CSS:

@charset "utf-8";
/* CSS Document */

*{margin:0px;
padding: 0px;}

body {
  font: normal 600 14px arial, "lucida console", sans-serif;
  color: #ffffff;
  background-color: #1c1c1c;

}

img {
  border: none;
  display: inline;
}

input, textarea, select {
background-color:#CCC;
border: 1px solid #F00;
font-family: verdana;
font-size: 10px;
color:#000;
} 

A:link {
color: #333;
text-decoration: none;
}

A:visited {
color: #333;
text-decoration: none;
}

A:active {
color: #333;
text-decoration: none;
}

A:hover {
color: #900;
text-decoration: underline;
}

.tab_links A:link {
color: #000;
text-decoration: none;
}

.tab_links A:visited {
color: #000;
text-decoration: none;
}

.tab_links A:hover {
text-decoration: none;
color: #FFFFFF;
border-bottom: 1px solid #C00;
}

.sample_links A:link {
text-decoration: none;
color: #FFFFFF;
border-bottom: 1px solid #C00;
}

.sample_links A:visited {
text-decoration: none;
color: #FFFFFF;
border-bottom: 1px solid #C00;
}

#sample_text {
font-size: 12px;
color: #FFF;
}

.sample_links A:hover {
text-decoration: none;
color: #333;
border-bottom: 1px solid #C00;
}

#third_box_heading A:link {
font-size: 22px;
font-weight: bold;
color: #000;
text-decoration: none;
}

#third_box_heading A:visited {
font-size: 22px;
font-weight: bold;
color: #000;
text-decoration: none;
}

#third_box_heading A:hover {
font-size: 22px;
font-weight: bold;
color: #333;
text-decoration: none;
}

#exercise_list A:link {
font-size: 16px;
font-weight: bold;
color: #000000;
text-decoration: none;
}

#exercise_list A:visited {
font-size: 16px;
font-weight: bold;
color: #000000;
text-decoration: none;
}

#exercise_list A:hover {
font-size: 16px;
font-weight: bold;
color: #333333;
text-decoration: none;
}

#wrapper {
  	width: 1000px;
  	margin-left: auto;
  	margin-right: auto;
  	background-color: #000000;
}

#header {
width: 100%;
height: 250px;
margin: 0px;
background-color: #000000;
}

#header_site_title {
width: 607px;
height: 156px;
background-image: url('../images/title.png');
background-repeat:no-repeat;
}

#header_site_logo {
width: 393px;
height: 280px;
background-image: url('../images/newlogo.png');
background-position: top 40px;
background-repeat:no-repeat;
background-color: #000;
}

#header_site_menu_top {
width: 607px;
height: 40px;
background-color: #ffffff;
background-position: top;
}

#header_site_menu_spacer {
width: 607px;
height: 84px;
background-color: #000000;
background-image: url('../images/black_spacer.png');
background-repeat:no-repeat;
}

#header_site_menu_bottom {
width: 1000px;
height: 41px;
background-color: #9e0000;
}

#content {
float: left;
width: 1000px;
margin: 0px;
padding: 0px;
background-color: #000;
background-image: url('../images/background_body.png');
background-repeat:no-repeat;
}

#content_wrapper {
float: left;
  	width: 1000px;
margin: 0px;
padding: 0px;
padding: 0px;
}

#third_box_heading {
float: left;
  	width: 100%;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 22px;
font-weight: bold;
color: #999;
}

#third_box_content {
float: left;
  	width: 100%;
margin: 0px 0px 0px 0px;
padding: 8px 0px 20px 0px;
border-top: 1px solid #F00;
text-align: left;
font-size: 12px;
}

#third_box_small {
float: left;
  	width: 100%;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 9px;
font-style: italic;
}

#footer_top {
  float: left;
  width: 1000px;
  height: 20px;
  margin-bottom: 0px;
  background-color: #9e0000;
  text-align: center;
  vertical-align: middle;
  color: #FFF;
}

#footer_bottom {
  float: left;
  width: 1000px;
  height: 30px;
  margin-top: 0px;
  margin-bottom: 10px;
  background-color: #000000;
  text-align: center;
  vertical-align: middle;
  color: #FFF;
}

.tab_link_half {
float: left; 
width: 1000px;
padding: 0px;
margin: 0px 0px 0px 10px;
list-style: none;
}

.tab_link_half li.current{
float: left;
padding: 0px;
margin: 0px;
background-image: url('../images/current_tab.png');
background-repeat: repeat;
width: 160px; 
height: 30px; 
text-align: center;
list-style: none;
border: 1px solid black;
line-height: 28px;
color: #FFF;
}

.tab_link_half li{
float: left;
padding: 0px;
margin: 0px;
background-image: url('../images/other_tab.png');
background-repeat: repeat;
width: 160px; 
height: 30px; 
text-align: center;
list-style: none;
border: 1px solid black;
line-height: 28px;
}

#display_heading_left_half {
float: left;
  	width: 300px;
margin: 3px 0px 5px 10px;
padding: 5px;
color: #FFF;
text-align: center;	
font-size: 18px;

}

#display_heading_right_half {
float: right;
  	width: 300px;
margin: 3px 10px 5px 0px;
padding: 5px;
color:#FFF;
text-align: center;
font-size: 18px;

}

#display_box_off_left_half {
float: left;
  	width: 638px;
margin: 00px 5px 5px 10px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_off_right_half {
float: right;
  	width: 308px;
margin: 00px 10px 5px 5px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_left_half {
float: left;
  	width: 473px;
margin: 10px 5px 5px 10px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_right_half {
float: left;
  	width: 473px;
margin: 10px 10px 5px 5px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_left_third {
float: left;
  	width: 308px;
margin-top: 5px;
margin-left: 10px;
margin-right: 5px;
margin-bottom: 10px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_middle_third {
float: left;
  	width: 308px;
margin-top: 5px;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 10px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_right_third {
float: left;
  	width: 308px;
margin-top: 5px;
margin-left: 5px;
margin-right: 10px;
margin-bottom: 10px;
padding: 5px;
	background-image: url('../images/box_background.png');
background-repeat: repeat;
border: 1px solid black;
}

#display_box_third_header {
float: left;
  	width: 308px;
margin: 0px;
padding: 0px;
text-align: center;
}

#underline {
border-bottom: 1px solid black;
}

#about_header {
font-size: 20px;
font-weight: bold;
color: #333;
border-bottom: 1px solid red;
}

td.exercise_title {
font-family: Verdana, Geneva, sans-serif;
font-size: 25px;
font-weight: bold;
color: #660000;
text-align: left;
vertical-align: top;
}

td.exercise_subtitle {
font-family: Verdana, Geneva, sans-serif;
font-size: 10px;
font-weight: bold;
color: #660000; 
text-align: left;
vertical-align: top;
}

td.exercise_content {
font-family: Verdana, Geneva, sans-serif;
font-size: 16px;
font-weight: normal;
color: #FFF;
vertical-align: top;
padding-top: 10px;
}

#trx_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/TRX_tab_final.png');
height: 733px;
width: 638px;
}

#trx_row1 {
padding: 0px;
margin: 0px;
height: 157px;
width: 250px;
position: absolute;
left: 195px;
top: 190px;
display: block;
}

#trx_row2 {
padding: 0px;
margin: 0px;
position: absolute;
width: 350px;
left: 410px;
top: 400px;
display: block;
}

#trx_row3 {
padding: 0px;
margin: 0px;
height: 157px;
width: 250px;
position: absolute;
left: 373px;
top: 450px;
display: block;
}

#trx_row4 {
padding: 0px;
margin: 0px;
position: absolute;
left: 510px;
top: 620px;
display: block;
}

#trx_page_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/trx_page_background.png');
height: 582px;
width: 638px;
}

#trx_page_row1 {
padding: 0px;
margin: 0px;
height: 157px;
width: 400px;
position: absolute;
text-align: center;
left: 140px;
top: 275px;
display: block;
}

#trx_page_row4 {
padding: 0px;
margin: 0px;
position: absolute;
left: 510px;
top: 470px;
display: block;
}

#mealplan_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/meal_plan_front.png');
background-repeat: no-repeat;
height: 942px;
width: 638px;
}

#reg_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/registration_background.png');
background-repeat: no-repeat;
height: 645px;
width: 638px;
}

#topten_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/top_10_blue.png');
background-repeat: no-repeat;
height: 597px;
width: 638px;
}

#exercise_sample_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/exercise_EXAMPLE_page.png');
background-repeat: no-repeat;
height: 707px;
width: 638px;
}

#exercise_sample_content_vid_1 {
padding: 0px;
margin: 0px;
position: absolute;
left: 40px;
top: 150px;
display: block;
}

#exercise_sample_content_vid_2 {
padding: 0px;
margin: 0px;
position: absolute;
left: 40px;
top: 380px;
display: block;
}

#exercise_sample_content_samples {
padding: 0px;
margin: 0px;
position: absolute;
left: 400px;
top: 100px;
display: block;
}

#exercise_sample_content_now {
padding: 0px;
margin: 0px;
position: absolute;
left: 120px;
top: 610px;
display: block;
}

#exercise_front_content {
position: relative;
padding: 0px;
margin: 0px;
background-image: url('../images/exercise_page_front.png');
background-repeat: no-repeat;
height: 707px;
width: 638px;
}

#exercise_front_content_now {
padding: 0px;
margin: 0px;
position: absolute;
left: 360px;
top: 340px;
display: block;
}

ul li ol{
clear: both;
margin-left: 20px;
padding-left: 20px;
list-style: inside;
list-style-position:inside;
}

 

 

My php code:

					// start the table for display
					echo '<table cellpadding="3" cellspacing="2" border="0" width="100%">';	

						// setup news query
							$query = "SELECT * FROM articles 
		  			          WHERE id = '$Rid' 
							  LIMIT 1";

							// send query off
							$sth    = execute($query, 1);
							$ref 	= fetch_array($sth);

							// get data
							$id  			= $ref['id'];
							$date  			= $ref['date']; 
							$cat  			= $ref['cat']; 
							$title  		= $ref['title']; 
							$content    	= stripslashes($ref['content']);
							$author  		= $ref['author']; 


							// check to see who wrote the article, if brian
							if ($author == '0') {
								echo '<tr><td align="center"><div id="about_header">Brian McKay: <br>Exercises Physiologist</div></td></tr>';
							} else { // if scott
								echo '<tr><td align="center"><div id="about_header">Scott\'s Words of <br>Wisdom</div></td></tr>';
							} // END if ($author == '0') {

							// convert mysql date to a more readable format
							list($yr,$mon,$day) = split('-', $date); 							
							$display_date = date('F j, Y', mktime(0,0,0,$mon,$day,$yr)); 

							// see if there is a category
							if (strlen($cat) > 0 ) {
								$cat_string = 'Category: ' . $cat;
							} else {
								$cat_string = 'Category: General ';
							} // END if (strlen($cat) > 0 ) {

							// display the header
							echo '<tr><td><div id="exercise_list">' . $title . '<br>' . $display_date . '  ' . $cat_string . '</div><br></td></tr>';
							echo '<tr><td><div id="content_stuff">' . nl2br($content) . '</div></td></tr>';

							// end table and div containter
							echo '</table></div>';

				} // END if ($Rid == '0') {

 

Whats in the $content variables:

<table cellpadding="3" cellspacing="2" border="0" width="100%">

<tr><td align="center"><div id="about_header">Scott's Words of <br>Wisdom</div></td></tr>
<tr><td><div id="exercise_list">Testing!<br>April 13, 2010  Category: Test</div><br></td></tr>
<tr><td><div id="content_stuff">
   What is this!<br><br>
  <ol><li>Hello</li><li style="color: rgb(153, 0, 0);">THis</li><li>is</li><li><span style="color: rgb(0, 0, 153);">me</span>!</li></ol>This<br>   is a<br><br>       space<br></div></td></tr>

</table>

 

I'm so lost in this.  I have no idea why the bullets are not right.  When I take whats in $content and display it in a blank page (no CSS), everything is correct.  So it leaves me to believe its a CSS issue but I cant see it :(

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.