0

I have an array of various input boxes, that when filled, fills up the database with information. Then, from another file, I take the information and print it out to the screen.

What I want to do is to put a symbol in front of each line, however using something like .style br {}; doesn't seem to work.

Reading the from MySQL, using Wordpress if that matters.

EDIT:

I was asked to post how I want it to look like. I think this is pretty straight-forward, but here it is anyway:

@ Entry1
@ Entry2
@ Entry3

EDIT #2:

I would prefer it to be in CSS, if that's not possible, then PHP. Javascript would be the last solution that I want.

I have tried the following and it didn't work at all:

.myform.lines br {
    border-bottom: 1px dashed #000000;
    background-color: #ffffff;
    display: block;
}
Jack
  • 653
  • 1
  • 6
  • 14
  • 3
    Show us what you have to work with and what you want it to look like... – sachleen Jul 16 '12 at 01:26
  • If you are considering css or javascript solutions to this question (which I think you should) then you would want to add css and javascript tags. – AllInOne Jul 16 '12 at 01:36
  • Thanks. I thought I've already added CSS tag - corrected. :) As for the work - I've already described what I've tried, didn't mention googling around. As for the example, even though I think it's very straight-forward, I've added it. :) P.S. Won't reply until about 8 hours from now. – Jack Jul 16 '12 at 01:41
  • The question is slightly confusing.. do you want this done in PHP, JS or CSS? Yes, all 3 are possible. I don't answer such broad questions, now if you update your question with either the PHP which echoes the content or the generated HTML once you're back, I'll take a look at it if you don't have a satisfactory answer yet. – Fabrício Matté Jul 16 '12 at 02:04
  • Edited the main post again. I'd prefer CSS. Sorry for not mentioning that. – Jack Jul 16 '12 at 09:08

2 Answers2

1

Hi have a look at Can you target <br /> with css?

I tried the following html page:

<html><head><title>Test</title>
</head><body>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('br').replaceWith('<br>@ ');
});
</script>
hi<br>
there<br>
testing<p>
again<p>
</body></html>

This results in

hi
@ there
@ testing

again

Here is some more code that also does basically the same thing - it adds a symbol (@) at the start of each line (assuming new lines follow a br).

<html><head><title>test2</title>
<script type="text/javascript">
function replaceLineBreaksWithHorizontalRulesInElement(element)
{
    elems = element.getElementsByTagName( 'br' );
    for ( var i = 0; i < elems.length; i ++ )
    {
        br = elems.item( i );
        txt = document.createTextNode("@ ");
        br.parentNode.insertBefore(txt, br.nextSibling);
    }
}
</script>
</head>
<body onload="replaceLineBreaksWithHorizontalRulesInElement(document)">
testing<br>
one<br>
two<br>
three<br>
four<br>
five<p>
six<p>
</body></html>

Note that this does work in both firefox and internet explorer giving the same results. If you remove the space however then firefox shows a space anyway, and internet explorer shows no space. I think this won't be an issue for you though, since you want the space.

Community
  • 1
  • 1
Jevan
  • 131
  • 1
  • 6
  • Well the first form does work, however I want it to be targeted, which brings us to the second form. However my code utilizes
    tags, and we can't use onload with them, so it does not work.
     – Jack Jul 16 '12 at 09:09
0

How about

.mySelector:before { content: '@'; }
j0k
  • 22,600
  • 28
  • 79
  • 90
Martin
  • 6,632
  • 4
  • 25
  • 28
  • Can I use it with
    tags? (I've implied that I do not want to target anything more than necessary, like the body tag for example, in the upper post) Sorry, I'm quite new to all this. I presume, however, that it will add @ before the _content_, and my content is inputted by the help of a textarea, which means it would add a symbol before the whole content. I've done it with CSS, but that's not what I'm looking for - I need a symbol before every line.
     – Jack Jul 16 '12 at 11:39
  • So update the selector to the line, `div p:before { content: "@"; }` etc. Create a fiddle and it'll help :) – Martin Jul 16 '12 at 11:42
  • Already tried that, it didn't work. Nor div br, nor p, nor br. If without any of the div/p/br tags, it adds it only at the very first line, not on breaks. – Jack Jul 16 '12 at 12:41
  • I've solved it with editing some of the Javascript code posted earlier. Seems like coffee does help! :) – Jack Jul 16 '12 at 12:59