Styling event

[davy_yg]

Hello,

I am trying to stylize the event in the front page:

Event frontpage

I wonder why it does not work.

index.php

<?php

include('include/con_database.php');

$result = mysql_query("SELECT * FROM dynamic_content WHERE CatID='4' LIMIT 2");

echo '<br><br>';

echo '<table border="0"><tr>';

while ($data = mysql_fetch_array($result)){

echo '<div id="banner">';
echo '<td width="25%">';

echo '<div id="title">';
echo '<a href="http://localhost/IndonusaCMS/event_article.php?id='.$data['ID'].'">'.$data['title'].'</a>';
echo '</div>';
echo '<div id="text">'.substr($data['content'], 0, 150).'</div>'.'<br>';
echo '</td>';

echo '<td width="25%">';
echo '<div id="gambar">'.'<img src="images/events/thumb/' . $data['images'] . '">'.'</div>'.'<br>';
echo '</td>';

echo '</div>';
}

echo '</tr></table>';


?>

style.css

#banner #title a:link{font-size: 15px; text-decoration: none; color: white;  width: 50px; z-index: 2; font-weight:bold;}
#banner #title a:visited{font-size: 15px; text-decoration: none; color: white; width:50px; z-index: 2;}

See, the title suppose to be white color and has no underline, but this is not the case.

Why is it?

Thanks in advance.

[davy_yg]

I figure how to style the title but not the content. I would like the content to be smaller font size, how?

index.php

echo '<table border="0"><tr>';

while ($data = mysql_fetch_array($result)){

echo '<div id="banner">';
echo '<td width="25%">';

echo '<div id="title">';
echo '<a href="http://localhost/IndonusaCMS/event_article.php?id='.$data['ID'].'">'.$data['title'].'</a>';
echo '</div>';
/* echo '<div id="text">'.substr($data['content'], 0, 130).'</div>'.'<br>'; */
echo substr($data['content'], 0, 130).'<br>';
echo '</td>';

echo '<td width="25%">';
echo '<div id="gambar">'.'<img src="images/events/thumb/' . $data['images'] . '">'.'</div>'.'<br>';
echo '</td>';

echo '</div>';
}

echo '</tr></table>';

style.css

#banner #text {width: 250px; font-size: 6px; color: black; z-index: 2; text-align: left;}

table,tr,td {padding:5px; font-size: 13px;}
table a:link{text-decoration: none; color: white; font-weight: bold;}
table a:visited{text-decoration: none; color: white; font-weight: bold;}

None of these works, it only changes the title font size, why?

[JorgeM]

it would help to see your HTML markup rather than the PHP code to see what is actually rendering in the browser. Do you have this page online?

[davy_yg]

I am trying to make the black font smaller.

IndonusaCMS

[nauticalmac]

There is inline style in your html which overides your stylesheet:
<span style="font-size: medium;">...black text...</span>

[davy_yg]

I wonder where that inline style comes from?

I am trying to apply the style.css instead of that inline style which I do not know where it's come from nor know how to change it.

[nauticalmac]

Inline style takes priority over style sheet. You need to modify the html. Why don't you have access to it, are you using a CMS system?

[davy_yg]

yes, I am using a CMS system. I already post my code in my first post in this title.

[nauticalmac]

Maybe the inline styling is stored in the database $data['content'].
Your link to http://indonusa.net.id/indonusaCMS/ no longer works so I can't verify what I said earlier that the inline style is being applied to the content.
You may have to learn more or get help with the CMS system. How does the info get into the content field of the database? Which CMS system?
It's possible to use JS or jQuery to modify the styling after the page loads. I've resorted to that with CMS systems as a last resort but it's not a good practice.

[davy_yg]

Here is the new link: Indonusa

[nauticalmac]

I verified that your text is coming out as:
<span style="font-size:medium">Lorem...<br></span>
The span tag with style must be in the database. You would have to modify that in the database or change the font-size dynamically with javascript.