I have a list item from RSS I used the zRSSFeed in particular. I would like to have a custom image on each of the list items. I'm presenting them in blocks or 3 in a row on normal width. Technically I guess I could target each one of them separately, I have no more than 6 of them, but I was wondering if there was a much better way to do it. It would be no problem if I could add some additional classes, but the HTML is generated by RSS.
Any ideas?
Related
I have an MVC View where I need to display DATA in a certain format, example below is in alphabetic with a numerical value tied to that letter. It needs to be Top Down, split into 2 different columns. As shown in the image attached it is alphabetic going down, then when half way through it needs to start on the next column, row 1.
This will be in a partial view and be used with several different result sets. Definitely cannot hard code.
I dont have any code right now as I could either use either a table or just some Spans. Open to suggestions.
I've thought of splitting the array in half, then just looping through each array item by item but wondering if there is a better way.
Thanks in advance!!
Depending on your HTML structure (difficult to tell as you haven't shown it), you could possibly use css column-count:
.yourElement
{
column-count:2;
}
Other than that, splitting the array in half is not such a bad idea, i suppose it depends on the length.
I'm attempting to rearrange elements on a Volusion store for my employer. The products page we currently have looks like This
I've been tasked with moving the details box
(containing "Nothing says "I'm ready to learn!"), up and to the right, to align with the price box.
The box is a table contained in a hierarchy of nested tables, at roughly the same "depth" in a different branch.
I don't have access to the HTML for the page, only a template html file that generates menus and footers along with the relevant CSS. Some JS exists on the site but since I lack experience with it, I'm hesitant to get into it.
Because of the table-and-div structure, and the fact that I cannot edit the HTML, I'm left with tweaking stylesheets and possibly some javascript. My issue is this: How, using only these tools, can I take an element in one container and reposition it relative to elements in another container? I've tried
Position:Relative;
left:some percentage;
top:some negative percentage;
Which, for a single page, I can get to look quite good, but if I allow others to load the page it falls apart completely, due mostly to the fact that the container for the element I'm moving is calculated based on screen width, and the container for the destination is calculated with the width minus a constant value(the image for the product).
My employer is willing to accept that the arrangement won't be perfect, they know Volusion is the devil complex. But it's important to them that their products display all relevant information "above-the-fold". Obviously I've not found any sort of answers on this. I don't find all that many people who have to edit a webpage without access to the raw code, because that's stupid. Worse still, moving an element to align with a completely different container is just bad policy as I gather, but its what I'm being asked to accomplish.
The only way to do this on Volusion is with javascript. You do not have access to the HTML for the product page and given that it is built with tables there is no way to move the product description area up with CSS.
You need to use javascript to detach and append the product description box below the product details area.
There is no way around it... You need access to the HTML files. You could do it with absolute positioning but that is not good practice.
Because you are working with a template; if you change the arrangement of that page then all of the other product pages will follow. So the reason you can't find the HTML is probably because you are looking for a .php containing html..
I suggest to spend time understanding the template or get a volution expert.
This seems like a simple enough question, yet I've spent 3 hours and found no information on how to do it. I purchased Ext JS 4, and I'm trying to get the "Locking Grid" to appear on one of my web pages. The grid will be very simple in the end, with no fancy ajax or anything, just a grid to display some info. I went through their quick start tutorial, and it simply tells you to paste some code into a javascript file, and include a ref to that javascript file in the header of your page.
Well, that does nothing. No grid appears. And why would it, I haven't told the grid where to appear. How do you tell the grid to appear in a particular div on my page, or to appear on my page at all?
Either use the renderTo config or use the render method. Be sure to read the notes for these, specifically that you should not use render/renderTo on items going inside a container, only top level components.
Given some HTML code, is there a way (in Ruby on Rails, in particular), to tell how many lines the HTML will take up on the screen when rendered?
-- Clarifications:
It's in an erb file, but i'm just talking about one string that will be rendered as HTML so yes, text that contains HTML tags.
-- EDIT:
The bigger picture: I want to know how tall a particular segment of the page is so I can conditionally include certain "Next/Previous" links on the bottom. These navigation links appear above the aforementioned segment, so I only want to include the links on the bottom if the segment is very tall.
Essentially, no - it all will depend on the CSS being applied by the browser and the platform itself and lots of other variables. You can, however, detect the dimensions of elements once they are rendered.
Update
Pursuant to your edit, you pretty much need to do this on the client using JavaScript. It's actually pretty straight forward.
Add the Next/Previous element HTML to the page but hide it with CSS
Detect the height of the element in question
If the height is above you threshold size, display the hidden Next/Previous
With Jquery (the framework of champions):
//assuming a height of 200 as the threshold
var THRESHOLD_HEIGHT = 200;
if ($("#segment").height() >= THRESHOLD_HEIGHT) {
$("#links").show();
}
No.
How can you possibly know how wide my screen will be when I visit your website?
Look at YUI Paginator http://s831.us/hW6Dpd
You would probably be best off solving this problem with javascript (or even better a javascript library like jquery). You could measure the height of the div containing the text you want to paginate and dynamically break it apart and add links in the browser. There would be several ways of solving this problem but I would probably do it by sequentially chopping off paragraphs from the end and remeasuring and repeating until it was short enough. Obviously the chopped off paragraphs would have to be collected somewhere to be used for the next page (and recursively measured again in case the second page was also too long).
I'm building a page full of hyperlinks which are gotten from querying a content management system, so the number of links is variable.
The requirements need me to display all the links over 3 columns and make it look presentable.
So at the moment I've got myself a Map<Category, Hyperlink> and when I display it at the moment its in one big list on the page.
Is there some way I can dynamically get my columns to flow into each other so that each column contains a similar number of hyperlinks?
Thank you.
The easiest way I can think of to do this is to put the links in to an unordered list, then set the style for each list item so that they are 33% of the available width and displayed inline.
You might try looking at the following sites:
https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5268973.html
http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks
The second one is the best one, in my opinion. I used it before when I had the same problem. It gives all the code, really nice illustrations and you can just copy the code free of charge. I think this is exactly what you are looking for.