How can I add different font-styles to different rows?
I want all of them to have a different font-style. For example:
while($row = mysqli_fetch_array($result))
{
echo $row['Nimi']."<br>".$row['Kirjailija']."<br>".$row['ISBN']."<br>".$row['Kunto']."<br>".$row['Hinta']."€"."<br>".$row['Pvm'];
echo "<br>"."<br>";
}
I am not so good at php. But I gave a little try about it like this:
Slight modification to your code.. Adding a classing to each row!
i = 1;
while($row = mysqli_fetch_array($result))
{
/* adding <span class="row1"> row2 etc.. using i */
echo "<span class='row".i."'>".$row['Nimi']."<br>".$row['Kirjailija']."<br>".$row['ISBN']."<br>".$row['Kunto']."<br>".$row['Hinta']."€"."<br>".$row['Pvm'];
echo "<br>"."<br></span>";
i++;
}
Giving Styles in css based on row names:
.row1{
font-family: verdana;
}
.row2{
font-family: arial;
}
etc..
I am repeating once again, I'm not sure about syntax.. I am posting this only to share the concept hoping that it should work! :)
For example:
style="font-family:verdana;"
You can use inline styling <span style="color: red;">test</span>, or use classes of css: <span class="red-color">text</span> with a css
.red-color{
color: red;
font-family: Arial;
}
In general, it is better to use classes with an external css file - that would keep your code organized and scalable.
In your case it is possible to use inline style like:
echo "<span style=\"color: red; font-family: Arial\">" . $row['Nimi'] . "</span>" . "<span style=\"color: green; font-family: Verdana\">" . $row['Kirjailija'];
Also, it is not a good practice to use <br /> now-a-days. Better wrap each text with a <span>, or a <div>
Related
I have two arrays which I use implode() on to convert into strings which are then echoed out.
Ideally i'd like the 1 value from the one string to be next to the other value in the other string, prefably nested inside a
<p></p>
Here's the code I'm using to issue a line break after every value, wrap it in a div, and float it.
<?php
echo '<div class="wrapper"><div style="text-align:left; float:left;"
class="glue">';
echo implode('<br>',$test);
echo '</div>';
echo '<div style="text-align:right; float:right;" class="glue">';
echo implode('<br>',$_POST);
echo '</div></div>';
?>
This works well for now as both divs sit next to each other within my container but it would be easier if the values were inside P tags instead so I could easily put an image in-between them.
I've added some images below to better demonstrate what I'm going for.
The first one is what I've tried and the second one is what I would like.
Is it what you want?
<style type="text/css">
p{
overflow: hidden;
}
span.left{
float: left;
}
span.right{
float: right;
}
</style>
<?php
foreach($test as $k=>$v){
echo '<p><span class="left">'.$test[$k].'</span><span class="right">'.$_POST[$k].'</span></p>';
}
That is not possible until you split the paragraph tag into 2 halves.
Try this,
.div1 {
float: left;
}
.div2 {
float:right;
}
.div2 {
float:right;
text-align: right;
}
<p>
<div class="div1">Left Text</div>
<div class="div2">Right Text</div>
</p>
if both arrays have the same length the most simple example woud look like this:
<?php
$test[0] = "a";
$test[1] = "b";
$test[2] = "c";
$test[3] = "d";
$test2[0] = 1;
$test2[1] = 2;
$test2[2] = 3;
$test2[3] = 4;
for($i=0;$i<count($test);$i++)
{
echo "<p><nobr>".$test[$i] . "</nobr> <nobr style='float:right;'>" . $test2[$i] . "</nobr></p>";
}
if you wanna test to see if it fits just paste the code here
I want to get rid off small dots that appear when I use max-width (see // for details).
Here's my php that shows a messeage saved in session:
<?php
echo "<table id='delpos'>";
echo "<td id='del'>" . $_SESSION["del"] ."</td> ";
echo "</table>";
?>
And css that doesn't show background-color (until session exists) by using max-width + max-height :
<style>
#del {
background-color:red ;
color:white;
max-width:20px;
max-height:6px;
overflow:hidden; // tried using this to hide the small "red" dots...
}
#delpos {
margin-top:60px;
margin-left:30px;
position:absolute;
}
</style>
Please help:)
I want to get rid off small dots that appear when I use max-width (see // for details).
Here's my php that shows a messeage saved in session:
<?php
echo "<table id='delpos'>";
echo "<td id='del'>" . $_SESSION["del"] ."</td> ";
echo "</table>";
?>
And css that doesn't show background-color (until session exists) by using max-width + max-height :
<style>
#del {
background-color:red ;
color:white;
max-width:20px;
max-height:6px;
overflow:hidden; // tried using this to hide the small "red" dots...
}
#delpos {
margin-top:60px;
margin-left:30px;
position:absolute;
}
</style>
Please help:)
i'm trying to auto retrieve data from mysql server in specific DIV without manual refresh the web page.
My PHP code is:
function lastCodes(){
include('mysql.php');
include('config.php');
echo "<div id='content_data'>";
$get = mysql_query("SELECT * FROM scripts ORDER by date_added DESC");
if(mysql_num_rows($get)>0){
while($row = mysql_fetch_assoc($get)){
$get2 = mysql_query("SELECT * FROM accounts WHERE username = '$row[s_owner]'");
while($red = mysql_fetch_assoc($get2)){
echo "<table>
<tr>
<td width='22px'>";
if(!empty($red['avatar'])){
echo "<center>
<img src='$red[avatar]' style='width: 52px; height: 52px; margin-left: -30px; border: 2px solid #fff;' title='$row[s_owner]'/>
</center>
</td>";
} else {
echo "<td width='22px'>
<center>
<img src='/theme/$tema/icons/empty_avatar.png' style='width: 52px; height: 52px;' title='$row[s_owner]'/>
</center>
</td>";
}
echo "<td>
<a style='font-family: IndexName; color: #000; font-size: 14px; margin-left: 5px;'><b>$row[s_owner]</b> написа <a title='$row[s_name], Категория: $row[s_category].' href='#' style='text-decoration: none;'>нов код</a> <a style='font-family: IndexName; color: #000; font-size: 14px; margin-right: 10px;'>в $row[date_added]</a>
</td>
</tr>
</table>";
}
}
}
echo "</div>";
}
What should be in my case the jquery/ajax code if I want to retrieve this information in DIV called "content_data" in interval of 5 seconds? Thanks a lot!
You could place the contents of your lastCodes() function inside an otherwise empty PHP file, let's call it lastCodes.php.
And then use the load function from JQuery on the page where you want to retrieve the data
<div id="divTarget"></div>
<script type="text/javascript">
$("#divTarget").load("lastCodes.php");
</script>
But keep in mind that this way of coding can get messy real fast. I would recommend you to try any of the many great template systems available. It's not necessary for clean code but without one you will need some discipline keeping logic out of your view code.
And when you feel comfortable with one of those you could go even further and try a template system on the frontend using Javascript, for example Handlebars. With one of those you will be able to write clean code and send your data using JSON which will lower the size of the HTTP response and at the same time make the data more usable for other scenarios than simply rendering it as HTML.
Edit: To update the data every 5 seconds:
<script type="text/javascript">
window.setInterval(function() {
$("#divTarget").load("lastCodes.php");
}, 5000);
</script>
You just have to use the setInterval() function to load the contents of the page every 5 seconds(5000 milliseconds)
</div>
<script src="jquery.js"></script>
<script>
setInterval(function(){
$('#container').load('page.php');
}, 5000);
</script>
I can see that you have a function so you might as well call it. If that doesn't work then try to put your code outside of the function.
lastCodes();
Be sure that its actually changing its contents and that the page that you're calling actually works, you can test it by accessing the page itself and see if it has any output.
I have the following css code:
#Layer3
{
position:absolute;
width: 89%;
height: 40%;
left: 10%;
top: 56%;
background-color: #f1ffff;
}
#Layer3 h1
{
font-size: medium;
color: #000033;
text-decoration: none;
text-align: center;
}
.tableheader {
border-width:10px; border-style:solid;
}
.tablecontent {
height: 95%;
overflow:auto;
}
However, when I use this PHP to generate the html
echo '<div id="tableheader" class="tableheader">';
echo "<h1>{$query} Auctions</h1>" . "\n";
echo "</div>";
echo '<div id="tablecontent" class="tablecontent">';
echo "<table border='0' width='100%'><tr>" . "\n";
echo "<td width='15%'>Seller ID</td>" . "\n";
echo "<td width='10%'>Start Date</td>" . "\n";
echo "<td width='75%'>Description</td>" . "\n";
echo "</tr>\n";
// printing table rows
foreach ($rows as $row)
{
$pk = $row['ARTICLE_NO'];
echo '<tr>' . "\n";
table contens generated in here
echo '</tr>' . "\n";
}
echo "</table>";
}
echo "</div>";
which generates this html:
<div id="tableheader" class="tableheader">
<h1>hardy Auctions</h1>
</div>
<div id="tablecontent" class="tablecontent">
<table border='0' width='100%'>
<tr>
<td width='15%'>Seller ID</td>
<td width='10%'>Start Date</td>
<td width='75%'>Description</td>
the rest of table stuff
</div>
The stylesheet is correctly referenced so I am unsure what is causing the error. But there is no border around tableheader at all. Both of these layers are in Layer3 which no longer displays properly on the page.
#tableheader {
border: 10px solid #000;
}
Try giving it a color.
EDIT: since its id is tableheader, try changing the style selector to be an id. You could also try using !important to see if anything is overriding your class selector.
Specificity values:
inline: 1000; id: 100, class: 10, element: 1
!important trumps all other non-important declarations.
Start by browsing the HTML DOM in the rendered page either using Firebug in Firefox or using the IE Developer Toolbar in IE.
That way, you can see what styles are actually associated with the element in the rendered page. It's a lot easier to debug the issue from there.
One possibility is that there's a syntax error somewhere in the CSS file causing the styles not to be applied correctly.
I've just had a quick look at this and it seams fine, I've also created a local copy of these and the styles work out okay as well, I get a nice thick black border around the h1 text.
So from what your explaining something is either overwriting the styles, or the styles aren't being applied to the page.