I am designing an email template. I have a running list of brand names hyperlinked to their websites. I would like it to be displayed inline for full-width, and stacked for narrow screens. I had separators in the past like a bullet or a vertical rule such as this: "|". But in mobile it's awkward considering only one name appears per line.
The next thing I tried was to enclose each list item in a border, but Outlook10/13 aren't handling the padding and margin as you know. I want a simple solution that I can show to novices when they populate the template. Any ideas? I'm adding screenshots of what I tried with the borders. But any other idea is welcome.
Thanks!!!
Full Width:
Mobile:
I have tried a lot of ways myself and one thing i found out was having logos in place of links often work better. I know images have to be downloaded but once they are downloaded it looks good. If you do go with images, you can style the alt tags to look like above when its not loaded.
Related
This is perhaps a more general question as I'm looking for ideas on how to approach a problem working with PDFView/PDFKit. I have a small sample application that allows you to display a page, select a range of text and then associate a comment with that text. Once the comment is saved the comment is displayed on the PDFView page in the margin via an overridden draw() function for PDFView.
Problem is that with very small margins the comments can be very squished. I've been looking for a straight-forward solution and would very much appreciate ideas on how to address it.
The obvious (ie, easy) solution is to change the actual "page size" in the PDFView and have wider margins, but of course PDFKit has no support for that (I don't think). Another thought was to go to a custom PDFView library but the only ones I found when I last looked were iOS (not Cocoa) based.
Last idea was to instead of drawing directly on the page have some sort of pop-up window (like a sticky-note) contain the note but then it would need to be moved dynamically with the scrolling of the page. And of course one other was to recreate the PDF dynamically for viewing and make all the pages larger... but I've not dug into how much of a performance hit / effort that would entail.
Maybe there's a simple/obvious solution that I've missed?
I created a simple sample app in gitHub which shows the basic functionality for people to play with if that's of help. https://github.com/jcnolan/PDFMarginTextView
I'm building an app with Phonegap/Cordova and Web standards, such as HTML and CSS. However, somewhere on the part of creating this, my skills aren't sufficient.
Ok, let's get this straight: I'm trying to create a navigation bar at the top of the screen. Very basic, even without buttons, just plain text with links.
Check-out this screenshot. As you might see or not.. The middle one isn't exactly placed in the middle. I've tried with div styles, span classes and tables seem the best option.. Yet still insufficient.
What's the best option to create such header?
p.s. No, of course there won't be a border in the table :D - Just for viewing. ^^
I did an example of something like this for a talk... here's a basic version with just a header and some scrollable content: http://jsbin.com/UWeQeli/1/edit
Hope it helps.
Ok im struggling to find anything on this as im probably searching the wrong keywords.
I have a backed form thats use to display content on a page. When entering the details i want to be able to use a basic text editor to style the text, like bold, bullets, underline.
On top of that i would also like to allow them to wrap section in paragraph tabs, apply a certain style i.e style id="x".
Its more for backend so it doesnt have to be really user friendly but if there was an uncomplicated way of showing the styles in the form as i apply them, basically a WYSIWYG view. If not i will settle for applying the styles without having to see all the hmtl and css tags in the editor but when the information is passed via the INSERT query it will show pass all the relevant code like My Style and so on.
Now im quite happy to spend the time learning how to do this if you point me in the right direction but i have no idea what keywords to search. Ideally if there is a script out there i can just edit to my needs would be great too rather than starting from scratch.
Finally since im learning php and mysql still keeping it dumbed down will help and also since my values im passing is going to be full of characters the code wont like what functions should i look up to pass the code and content into the database to avoid breaking the code
I'm not entirely sure what you mean, but it seems you can achieve what you want using an editor like for example TinyMCE in combination with JQuery?
With JQuery you can show/hide items and ander your css like
$("p").mouseover(function () {
$(this).css("color","red");
});
I have a combo box that when I open it should show text like
However I get something like
with the scrollbar set to middle. Thing is sometimes for the same values it shows properly
and sometimes it shows from middle(for same value).
I want it to show properly like in the first image and I've tried a couple of things but with no succes.
itemSection.setHoverAlign(Alignment.LEFT);
itemSection.setTextAlign(Alignment.LEFT);
itemSection.setAlign(Alignment.LEFT);
... and other irelevand stuff ...
Any help is highly appreciated. Thanks alot!
If I am not getting wrong, You want to set your scrollbar at particular position. FOr that you need to ovverride the css of that and try to set scrollbar position to 0. So that your problem will get solved.
The problem with any kind of selections box is, that the boxes display and behave completely different across browsers. The older the browser the worse it handles long texts in selection boxes (some just truncate the text). I suggest to keep the displayed text as short as possible. That way you can avoid this problem.
If you really need long description, you can try to add a tooltip to every entry. Or use a different widget to make the select from, e.g. some custom widget in a separate dialog...
Does anyone know of a GWT widget that works like a spelling suggestor?
Ideally it would be similar to this: http://www.polishmywriting.com/
I need a click-triggered popup on user generated text so that I can suggest replacements (I am not building a spell-checker, but something similar). I also really like the way the polishmywriting menu is set up (when you click on an underlined word).
Is there a widget that would allow me to make something similar?
Basically I'm trying to clone the little popups used by spellchecking in Gmail and polishmywriting.
If not, what would be my first step to make it?
Thanks for your time and answers,
DTrejo
Have you had any luck yet? I know it's been quite a lot of time, but found this just now.
It is a very specific widget, so maybe you won't be able to find exactly what you are looking for. In that case, making one from scratch might prove as a challenge.
The first thing you will notice is that a regular gwt TextArea won't do the job of holding the text. You will need something more flexible to dynamically put clickable labels in the text itself.
TinyMCE is a platform independent web based Javascript HTML WYSIWYG editor control, released as Open Source.
http://en.wikipedia.org/wiki/TinyMCE
There is also a gwt wrapper available, so you might find that useful:
http://code.google.com/p/tinymce-gwt/
If you check the polishmywriting editor after the spell checking markup is displayed, you will notice it is not a TextArea. The text is a series of paragraphs and the labeled parts are span elements. This are the elements you can easily access with gwt and put some click handlers there to open the popup.
And for the popups, it shouldn't be difficult. Use a standard gwt PopupPanel. The popup panel can be displayed in a relative position to other elements displayed on the page:
popup.showRelativeTo(otherElement);
If you did find something useful in the mean time, feel free to share.