Need help? Check out our Support site, then


WordPress.com Forums » Support

The White Spaces trauma continues...

  1. vandeurz
    Member

    The upgrade is working fine for me, but I am still fighting the bloody linebreak/white space problem in the text editor.

    For example:
    Both tags tend to disappear once the post is saved or published. You can see the result here:
    http://planetbarebottom.wordpress.com/2008/06/01/eve-and-adam-1/#more-679

    scroll down to close to the bottom but, *WARNING*, the text of the post mocks christian concepts!

    I've got 2 images there, both (the 8th and the 9th) are lined to the left. The upper, small one has been given a text wrap, no problem. Next comes nr 9, a larger image, but without text on the side (the image spreads too wide for that). Both images however keep glueing together. To get a small amount of white space between them, I inserted in HTML
    < p align="left" > < /p >
    and I also tried
    < p > < /p > (minus the spaces, of course)

    The problem here seems to be that the height of the wrapped text is less than the height of the image. So between image 8 and 9, there is sort of a vacuum created, and it sucks image 9 literally upwards, so both image borders connect, and stay that way. (And no, I'm not willing to decrease the scale of image 8, it's already too tiny.)

    You can see that the wrapped text does not align with the top of the small coloured image, So I pushed it down one line by inserting a separation tag there. This one works & holds, sofar! I hoped that the last line of that little textblock would push image 9 away. It doesn't.
    In my view the pushing off should also work if I put the dividing tag UNDERNEATH the text (or straight after the last word). Nope. Even a whole row of such separation tags do not work. They stay visible in HTML, but they don't have any effect on the lay out of the published post.
    I have also tried to use the spacebar after the last word and then make for a line break, or to add < /p > after every tag, but to no avail. Even if a wraptext consists of no more than one sentence or a name, it should be possible to keep the remains of the wrapped space 'open'.

    Now in this particular post the stuck images are not the end of my artistic blogworld, but sometimes it leads to a messy effect, and some separation is really desired. Hence my question (once more): how can I firmly add more white spaces between images and textblocks.

  2. raincoaster
    Member

    What are the other threads you posted in? It's easier to figure out a solution if we have all the information in one place.

  3. panaghiotisadam
    Member

    Try this:

    <p> </p>

    (You might need to insert it more than once.)

  4. panaghiotisadam
    Member

    Oops! " " goes between the "<p>" and the "</p>". I tried it (with your images) and it worked.

  5. panaghiotisadam
    Member

    Shit! How do you make that appear?
    One more try: "&", "n", "b", "s", "p", ";" - all joined together.

  6. singularcontiguity
    Member

    & a m p ; n b s p ; (without the spaces) should do it...

  7. boblets
    Member

    hm. I would normally say you need a div class "clear", but I'm not sure if wordpress have these in the css scripts. On an off-chance, you could try <div class="clearingdiv"></div>

  8. vandeurz
    Member

    pan...adam; no, that one keeps zapping away as well...

    Raincoaster, can't retrace my comments, and the search bar gives no data on any of my names.
    I use XP, Firefox (the clean one; the version 3 upgrade messes things up, so I've heard), template Andreas04, and the text editor that everybody uses. I always upload text from a notepad, all lay-out fun I do in the Visual & HTML sections of the wordpress editor. Added tags for fonts, hspace and wspace and so on work fine.

    I've looked up postal screams & screechesfrom other bloggers , nowhere I found a clear solution. But it MUST be possible to manipulate line spaces.

  9. boblets
    Member

    Try singularcontiguity suggestion first and let us know how it goes - I'm very curious...

  10. singularcontiguity
    Member

    Clearing can be done with an inline style attribute on the HTML element:
    <div style="clear:both;"></div>

    The usual way to create whitespace in HTML documents (which is really what we're producing here) is to adjust the margin and padding on some of the elements. For example, if you want some extra space before a paragraph, you can do something like
    <p style="margin-top:3em;">
    to start a paragraph with three times the width of a capital M (in the current font) above the paragraph.

    Margins, padding, and borders all work with the img element as well. If you're going to go into the HTML view to adjust some of this anyways, you can get better results by learning just a touch about the CSS box model. :-)

  11. singularcontiguity
    Member

    By the way, my "nbsp" suggestion is in response to panaghiotisadam's question about how to show the name of a character entity here in the forum without it getting converted into the actual entity (in this case, a non-breaking space).

  12. vandeurz
    Member

    boblets;
    No, I inserted it three times in a row, but the text editor does not recognize this tag as a valid one.
    I now see that that my textline in the top; 'Whenever the painter was asked...' has been pulled back to level with the topborder of the image again. De line break, the 'push downwards' I gave it with a separation tag, has vanished from HTML, simply by re-opening the post for Editing...

    This is ridiculous. I mean, a tag is supposed to work, or not. It shouldn't behave both ways.

  13. vandeurz
    Member

    We cross-posted...

    singularcontiguity (what happened to plain oldfashioned names like 'jim' and 'lisa' or ' me'?), I have a free account and can't change any of the template fixtures. And I think it's got nothing to do with CSS. Whitespacing is just a simple text editor option, related to a simple hammering on spacebar and/or Enter on one's keyboard.

  14. vandeurz
    Member

    ...a DOUBLE or more entry on spacebar and Enter, is what I mean. A single entry is always executed, if you want more than one, that's where the problem starts.

  15. singularcontiguity
    Member

    Hee... what happened is that I set up a very thematically oriented blog, with its own name and associated e-mail address, so that I can manage it separately from my truly personal stuff.

    Unfortunately, whitespacing isn't actually a text editor option when the result is going to be presented in a browser window. Unless you've put your text inside of certain HTML elements (such as inside a

     ...
    wrapper), white space and line breaks are determined by the browser, not by how many times you press the spacebar or the enter key. However, the inline CSS on HTML elements works with the free accounts - I use it regularly, and haven't invested in the CSS upgrade yet.

    --Michael

  16. singularcontiguity
    Member

    Nrgh.... stupid forum ate the tags, even with character entities... that should have been inside a [pre] ... [/pre] wrapper, but with angles < and > instead of [ and ].

  17. dlager
    Member

    @sinularcontiuity - im off thread here but,

    I was wondering if you know a site or book that lists the math set fonts in HTML that you use in your blog. and i was wondering if you'd share :p

  18. boblets
    Member

    singularcontiguity - I'm not super-suprised my suggestion didn't work - but wouldn't <div style="clear:both;"></div> do the job?

    There is not really such a thing as space in html. There is a sort of carriage return, though.. I fix all such bother directly in css (not in my blog, obviously), and clear was just an idea.

    vandeurz - what about singularcontiguity suggestion? Not working?

  19. singularcontiguity
    Member

    @boblets - It may in some cases, but clear really has to do with whether floated elements can appear next to the cleared element or not. Also, if I recall correctly, I've seen the editor eat some empty elements (like the div in the example), whereas the style attribute on the img element or on the following (non-empty!) p won't arbitrarily disappear on you.

    @dlager - The announcement for it in the FAQ is here, but it doesn't really tell you much beyond the fact that you can use LaTeX. I know there are some decent resources online, but I don't recall where they are - I usually just pull my copy of Kopka & Daly's A Guide To LaTeX off my shelf when I need to look something up.

    If you want some examples, go ahead and start a thread about it with LaTeX in the name (I really do encourage this!). I can pretty much guarantee I'll see it that way, and I'll quite happily help get someone else going with it. :-)

  20. vandeurz
    Member

    singular, if I put in HTML a Left or Right or Font tag (I never work in Andrea04's standard template font) right before some text, I see afterwards that a < / s p a n > or < / p > was added, here the text editor does the enclosing automatically.

    About browsers:
    OK, mine sometimes doesn't show flash images, that's just a matter of not having updated your Macromedia or whatever. Another pehnomenon is when an uploaded image exceeds the kb limit and spreads too wide so the widgets left or right are pushed to the bottom of your blog. That's not what really happens, it's how the browsers translate the overloaded lay out, right?

    =white space and line breaks are determined by the browser, not by how many times you press the spacebar or the enter key.=

    That a browser makes a few white lines go up in smoke, I cannot comprehend. That would mean that all unused spaces on a weblog would be made undone by a browser?? I see differences between IE and Mozilla pages, but not THAT drastic differences.
    Then why does a browser not gobble up the white spaces between hyphen and words?? Well, because it obeys the prompts from the spacebar... And my spacebar simply wishes to make 3 or 30 or 300 white spaces - read: unused page space - underneath these words, for a new paragraph. So somehow the carriage-return muscle screws it up. Or browsers are phobic to wide open spaces...

    I think the combination Image/Aligned text is the main culprit. Somehow this combination doesn't gel with the white spaces under and above, and neutralizes them. In the Visual working field of the editor my two images and tekst look odd, they are next to each other but out of sync. Once published on the blog page, the lay out shows in better shape. Nevertheless, even if you post plain text only, and try to infuse extra spaces, they tend to drop from sight. I know from an earlier blog that in the HTML of the templates, features like padding between text lines can be adjusted, and I did so, at the the time.

    Not so here. And I think it should be available, because carriage returns are such a basic feature.

  21. boblets
    Member

    singularcontiguity - makes perfect sense.
    (hehe - Latex - that's when I fall off the discussion :-)

  22. singularcontiguity
    Member

    That a browser makes a few white lines go up in smoke, I cannot comprehend. That would mean that all unused spaces on a weblog would be made undone by a browser?? I see differences between IE and Mozilla pages, but not THAT drastic differences.
    Then why does a browser not gobble up the white spaces between hyphen and words?? Well, because it obeys the prompts from the spacebar... And my spacebar simply wishes to make 3 or 30 or 300 white spaces - read: unused page space - underneath these words, for a new paragraph. So somehow the carriage-return muscle screws it up. Or browsers are phobic to wide open spaces...

    Thinking about it as "browsers are phobic to wide open spaces" is, to some extent, a good way to think about it. If you put 1, 10, or 100 spaces in a row, the browser treats it identically: it sees it as "hey, look, the previous word ended, and now there's a new one". However, browsers don't really object to wide open spaces as such - you just need to learn how to tell them, in a way that they understand, that you really want that space there. That's what the style attributes do...

    Does that make more sense?

  23. dlager
    Member

    @ singularcontiguity. thanks when i get passed this flu <'cough> i will check out the book
    "Kopka & Daly's A Guide To LaTeX". <'/cough>

    I was not aware that we could use XML strings "$" ! in the html editor. I am assuming this is only in a few special cases such as LaTex.

  24. singularcontiguity
    Member

    In this case, it's not actually an XML string; the $latex syntax is special. The reason they picked "$" as a delimiter is because that's used in LaTeX around an inline math environment, which is what's available to us here. :-)

  25. crunchy12
    Member

    One of the best ways in my opinion of tackling the issue of white space is to substitute punctuation for tab spaces. It allows for the work to spread itself out on its own; while at the same time providing a nice way of playing on words and sentences.

  26. vandeurz
    Member

    =Does that make more sense?=

    ...This browser's trying to bullshid me?

    Ok. And now for the command that makes browsers sit down and roll over and lay dead in total submission...

  27. singularcontiguity
    Member

    I haven't played much with Andreas04, so this may take a couple of passes to get you to exactly where you want to be. First pass: try the following. For the last image, where you have

    <img class="alignnone size-full wp-image-694" src="http://planetbarebottom.files.wordpress.com/2008/06/10015292.jpg?w=367&h=430" alt="" width="367" height="430" />

    in the HTML, add a style attribute to it so that it looks like this:

    <img class="alignnone size-full wp-image-694" src="http://planetbarebottom.files.wordpress.com/2008/06/10015292.jpg?w=367&h=430" alt="" width="367" height="430" style="margin-top:35px;"/>

    that should put a 35-pixel space above the last picture. Does that work?

  28. vandeurz
    Member

    Yes, it does! But only after I changed some components of the tag. I deleted the 'alignnone size-full' part, and also the width and height values. Not sure yet which one does the trick, I'll work it out later.
    I also removed your hyphen ; after 'px', I think this is necessary. But the margin-top addition enables one pushing around the image as much and as little as one wants.

    Hey, great!

    I think a lot can be achieved in the text editors' HTML. It's just a matter of finding out the right codes.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags