Php echo hyperlink error with br - php

Issue 1:
In echo of php hyperlink working correctly,but linked to localhost(testing servor).Check:
echo '<a href> <div class="ws14"><span class="city"><br>' . $row['fura'] . '</br></span></div></a>';
When i got results displayed it is hyperlinked as i want and when click on it,it goes to localhost/trial.php (my testing script).Not going to hyperlinked url i have echoed.Please specify.For example if i echoed google.com then on clicking it must connect to that,but connecting to my localhost/trial.php.Thanks in advance.
Issue 2:
In br tag,we can specify difference between two line.I had done like:
.br {
line-height: 4; visibility:hidden;
}
And this is working correctly.But somehow, in same page we need 2 different br tags distance then how to do that?
For example in above it is simply line height of 4,now in other paragraph same page it require line height 8 with br tag,so how to do that? If i use br tags in both which br tag it will connect like of 8 or 4?
It may be bad question but very irritating.In short: how to use br tags in both with different dimensions(heights) in same page?

for issue 1:
echo '<span class="city"><br>' . $row['fura'] . '</br></span></div>';
for issue 2:
your br is class not a tag. so you have to apply css style to your div element. you can't give line-height to br tag. like as follows:
.brclass1
{
line-height: 4; visibility:hidden;
}
.brclass2
{
line-height: 8; visibility:hidden;
}
Apply particular div tag to class example as:
<div class="brclass1" >your content </div>
and other div element
<div class="brclass2" />your content </div>

You're href has no parameters
echo ' <div class="ws14"><span class="city">' . $row['fura'] .'<br/></span></div>'; //google.com is just an example
Br is not a class it is a tag. I don't know what you are trying to do with br tag. If you want to style your `$row['data']. Get your divs element.
For example:
.ws14 {
//your css here
}
.city{
//your css here
}

Related

why are my divs showing in wrong place

I am showing 5 results on a html page using divs and absolute position. I have used display:table-cell; and display:flex; for center positioning of image and text.
What i have problem is with for some reason after creating a parent div for each result, giving it a border, for some reason eben though i use absolute position there seems to be some uniform space between results. I see the borders in the right place, but the result contents are shown out of place.
See here:
https://www.dropbox.com/s/deeycdr32ejcftd/proferror.jpg?dl=0
Something is spacing out the results wringly. When I take out the parent container labelled profile[1 to 6] then it does work.
heres the php which is echoing the HTML:
echo "<div id='results' style='position:absolute;left:0px;top:0px;'>"
(while loop)
echo "<div id='profile".$profileid."' style='border-style: solid;position:absolute;left:0px;top:".$yy."px;width:320px;height:50px;'>";
echo "<div id='pic".$profileid."' style='display:table-cell; vertical-align:middle; text-align:center;background-color: #434345;position:absolute;left:0px;top:".$yy."px;width:50px;height:50px;overflow: hidden;'>";
echo "<a href='http://rafnet.co.uk/click/php/requests.php?from=".$username."&to=".$row["username"]."'><img style='max-height: 100%;' src='http://rafnet.co.uk/click/images/".$row["image"]."' /></a></div>";
echo "<div style='color:#0d00ff;display:flex; align-items: center; justify-content: center;position:absolute;left:50px;top:".$yy."px;width:270px;height:30px;overflow: hidden;'>".$name."</div>";
echo "<div style='display:table-cell; vertical-align:middle; text-align:center;position:absolute;left:50px;top:".($yy+30)."px;width:270px;height:20px;overflow: hidden;'>".$info."</div></div>";
$yy+=60;$profileid+=1;
(end of while loop)
echo "</div>"
echo "<div style='display:table-cell; vertical-align:middle; text-align:center;position:absolute;left:50px;top:".($yy+30)."px;width:270px;height:20px;overflow: hidden;'>".$info."</div></div>";
Try taking away the second </div> at the end of this line
I managed to fix this issue. What I realised after some work was that all the divs inside the parent div "profile" were being positioned relative to its position.
so for those divs i changed
top:".$yy."px;
to
top:0px;
ref to css are you saying i shoudlnt use the style attribute to define things? Are you saying i should place the css in the head section and assign them using the id or class? I just using the style attribute as i can see without referencing to what element it applies to

CSS Overflow-x:scroll is showing content

I've searched through various forum posts on Overflow-x:scroll, which explain how to implement it, and in most cases the same fix has resolved the OP's issue.
However, I have followed these posts and still cannot seem to resolve my issue, please help!
I am creating an image preview pane (Large image, list of thumbnails), and I am trying to place the thumbnails in a scrollable DIV horizontally, but am striking out over and over again.
With my current code I have set the width to 200px, but despite the presence of overflow-x, the div is still showing all of the thumbnails across the screen.
#Thumbview { position:relative; height:100px; width:200px; overflow-x:scroll; overflow-y:hidden; white-space:nowrap; }
My PHP is as follows for this small bit:
<div id="ThumbView">
<?php
// Create a slide-able thumbnail view.
$piclist = explode(", ", $datafiller['PictureList']);
foreach ($piclist as $thumbnail) {
echo "<img src=\"./Images/Inventory/" . $_GET['carid'] . "/thumbnails/" . $thumbnail . "\">";
}
?>
</div>
I have attempted to enclose each IMG in a DIV, with no luck, change display types on both the container and the children to various inline elements. Still no change. Ideas?
Your id names should match (care about the V)
<div id="ThumbView">
#ThumbView
is this what u need?
http://jsfiddle.net/x96hq47c/

Overlapping relatively positioned objects after a jQuery function

So I've looked around quite a bit for an example to this but I couldn't find anything for what exactly I am trying to do.
I'm building a blog with the front page having a bunch of posts in order like this -
http://prntscr.com/1vjoun
The blogs vary in size based on how much text is in them -
http://prntscr.com/1vjozq
When you hover over a blog I am trying to make a small bar appear inside of the blog that overlaps the text at the bottom so that I can have some options appear, such as 'Like' 'Favorite' 'Feature' or w/e and this is where my problem comes in.
echo "<div class='blogpost' id='" . $row['blogid'] . "'>";
echo "<h3 class='blogheader'>" . $row['blogheader'] . "</h3>";
echo "<p class='blogbody'>" . $row['blogbody'] . "</p>";
echo "<div class='blogextras'></div>";
echo "</div>";
I create the 'blogextras' div that will hold the options mentioned above.
.blogextras {
position:relative;
height:35px;
width:100%;
background:#333;
}
I give it some style.
$(".blogpost").hover(function(){
$(".blogpost").css("overflow", "auto");
$(".blogextras").show();
$(".blogextras").css("position", "absolute");
});
$(".blogpost").mouseleave(function(){
$(".blogpost").css("overflow", "hidden");
$(".blogextras").hide();
$(".blogextras").css("position", "relative");
});
Add some jQuery.
But my final result makes the 'blogextras' div appear below where I want it to be (about 35 pixels) -
http://prntscr.com/1vjppq
I also tried not changing it's position from relative to absolute and this does give a kind of desired result except it makes the boxes re-size which I don't want it to do.
I want the 'blogextras' div to appear at the bottom of the visible text area every time no matter the size of the 'blogpost' div.
Sorry if I haven't been discriptive enough or haven't given enough code just post a comment if you want to see more.
Your .blogpost container needs a relative position so that you can position your .blogextras bar exactly within that container. You also need to give the .blogextras bar a higher z-index so that it overlaps the .blogpost content:
.blogpost {
position:relative;
overflow:hidden;
/* Other CSS */
}
.blogextras {
position:absolute;
z-index:10;
bottom:0;
left:0;
display:none;
height:35px;
width:100%;
background:#333;
}
$(".blogpost").hover(function(){
$(".blogextras").fadeIn();
});
$(".blogpost").mouseleave(function(){
$(".blogextras").fadeOut();
});
Untested, but that should give you ~ what you need.

Fill a container (a div) until it is full

I have an array of strings.
$x=array('blabla1', 'blabla2', ...);
I want to fill a div block with strings from $x until my div is full. The height of my div is fixed to $h.
For instance, I want to put in my div something like that
<div>
<ul>
<li> 'blabla1' </li>
<li> 'blabla2' </li>
<li> 'blabla3' </li>
...
</ul>
</div>
until it is full.
Any guess how to do so ?
Javascript or php ?
Thank you :)
Why I want to do this : I have a side div on my webpage with suggested links. I want to put as many suggested links as possible in this side div.
Colas
PS : Feel free to edit my post (eg, add tags).
Its going to be problematic to do this by just using php.
My suggestion is to do it using overflow hidden css property in combination with a jquery plugin like:
dotdotdot
You must determine the height of your div in any fixed measurable unit such as px. Then adjust the height of each list item. By dividing the height of div/ the height of list item, you will know the number of list items required say n so inside your div do the following:
<div class="define-height">
<ul>
<?php
for ($i = 0; $i < $n; $i++){
?>
<li><?php echo $x[$i];?></li>
<?php } ?>
<ul>
</div>
Because you already know the fixed height value of your div. You can also add a fixed height value to the li elements and then from php do the following:
I am assuming that you already set the fixed height values for the div and ul in your css.
$div_height = 500px;
$li_height = 21px;
echo '<div id="mydiv"><ul id="myul">';
for($i=0;$i<=$div_height;$i+=$li_height){
echo "<li>"."your content here"."</li>";
}
echo '</ul></div>';
Using jQuery client side:
while( $("#divId").height() > $("#ulId").height() ) {
$("#ulId").append("<li>blabla1</li>");
}
From the comments :
any reason you can't just use overflow: hidden? – Marc B
Then you have to doit through javascript. From javascript is the only way you can have the height of a dom element after created. Maybe this div has to be dynamically populated through an ajax call to php that returns only one li element. And after that in javascript calculate if there is enough space to anoter li element in that case do the next call until there is no more available space. You can also set overflow:hidden in your div but this will only hide the content that is out of the div. – slash28cu

separate one link into multi-links (php)

I have result php page with a html table. Inside row[3] i have spoilers. if i click on a text value i can see hidden content. Inside hidden content i have links on different linesTo make this:
- I insert text inside mysql textarea, so:
- Then I add javascript code in <head>section
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(".spoiler-label").click(function() {
$(this).parent().find(".spoiler-content").toggle();
});
});
</script>
- and then php code:
echo '<td><span class="spoiler-label">'.$row[1].'</span><div class="spoiler-content" style="display: none"><br><a href='.$row[3].'<a/></div><td>';
- To break the text in new lines i use this php code:
$row['3']=stripslashes($row['3']);
$row['3']=str_replace('<br />',"newline",$row['3']);
$row['3']=htmlentities($row['3']);
$row['3']=str_replace('newline',"<br>",$row['3'])
i obtain this final result:
but you can see the problems:
- formatting is missing because the <th> of row X is black and not orange
- the links inside the spoiler are 2 but are treated as if they are one link.
- i have not correctly link because google.com is http://google.com<br WHY?
You can see 2 links: http://alfa.com http://google.com but if i click over http://alfa.com the link is always http://google.com<br
I want:
-remove <br from link
-separate one link into different links (alfa.com & google.com)
-repair incorrect row formatting
This is my page complete code http://pastebin.com/zb22VqwD and this css http://pastebin.com/dFRFURGM
first off, your 1 line php code echo is wrong (u didnt close <a>). The css didnt work because of this.
(i removed the first echo)
second, an <a> tag cannot have another <a> tag inside it, so you should just remove the whole <a> from your code above, meaning it should be:
echo '<td><span class="spoiler-label">'.$row[1].'</span><div class="spoiler-content" style="display: none"><br>'.$row[3].'</div><td>';
then, when instead of for some reason changing ur correct <br/>'s into the old version <br> tag, use the tag to create an array:
$ary=explode('<br />',$row['3']);
$str="";
foreach($ary as $str2){
$str.="$str2<br/>";
}
and then echo $str into the row,
Your code should be:
$row['3']=str_replace('<br />',"newline",$row['3']);
$row['3']=stripslashes($row['3']);
$row['3']=htmlentities($row['3']);
$ary=explode('newline',$row['3']);
$str="";
foreach($ary as $str2){
$str.="$str2<br/>";
//$str.="$str2<br/>";
}
$row['3']=$str;
You are use beolow code:
$row['3']=stripslashes($row['3']);
$row['3']=str_replace('<br />',"newline",$row['3']);
$row['3']=htmlentities($row['3']);
$row['3']=str_replace('newline',"<br>",$row['3'])
Instead of above code use below:
$row['3']=str_replace('<br />',"newline",$row['3']);
$row['3']=stripslashes($row['3']);
$row['3']=htmlentities($row['3']);
$row['3']=str_replace('newline',"<br>",$row['3'])
Just replace first line to second and second line to first..just try...hope this help..

Categories