I am trying to use the cards layout in fusion tables to generate a report. I have customized the layout of the cards but I am having trouble figuring out how to size the cards so that they each fit on a letter sized page when you go to the 'publish' view. Right now, when I try to print, page breaks are happening in the middle of divs.
I know there are some CSS methods for doing this but Im wondering if I could insert the right tags/styles within the custom layout dialog or do I have to create a separate web-page.
Kind of late news, but you can now use "page-break-inside: avoid" in your CSS to reduce page breaks in cards.
Related
I'm looking for a way to create a custom layout in the QListView.
The problem is the following: I have a number of images, with different widths (height is the same). In code, these images are stored in QAbstractItemModel. I want to lay them out similar to "justified" layout in text editors, i.e. in each row there's an image in the start and in the end of the row, images in between are placed uniformly. Spaces between images on the same row should be equal.
I didn't find this customization functionality in Qt docs nor in google.
How can I achieve custom layout like this using Qt?
Here's the image, showing an example of the layout I need:
I tried to do that a while back, the result is this library: longscroll-qt. It does not use QAbstractItemModel however, since its structure does not fit the problem.
It solves all the nasty stuff, like what to do when there image sizes + spacings do not add up. And it supports real custom widgets to display items, that you can interact with (like pressing a button), which is not really possible in QAbstractItemViews.
i am very new to angular material, i want to implement grid system in my design, what i want in my design is i want certain div to be displayed on right button of the page which will shrink to bottom as page is scrolled down. i have tried using md-cards and md-grid from angular-material demos, but i cannot get output as i expected can any one help me on this?
I am looking to recreate this type of view for a list of 'offers' as groupons have when you visit the site on mobile:
As we can see they seem to be using a new unordered list item for each offer box, and then the offer itself is contained within a single list item, which has a link, image, header, and a table for the details about the bottom. This looks good and seems to work nicely.
I want to recreate this using bootstrap - in such a way that when I then view the layout on my desktop, the site scales up and perhaps new fields / details which were not visible in the example above suddenly become visible.
here, they are using tables. But, It is the old way, you can redesign itself with bootstrap. The only thing you should know is bootstrap.
they have a great documentation of their classes and what they do.
for example:- if you need an element to disappear in mobiles and appear in tabs and machines, you can use .sm-hidden class.
Give it a try.
Currently creating a single page responsive website in drupal 7 ,after making the page responsive ,added a block with two regions aboutus and ethics side by side that is in two column.
While reducing the browser width ,the content still remainas it is !!! I want the region about us to be below ethics ,but i am not aware how to do!!
Can anyone guide me with the aforestated question.
You can use float:left on both elements and give them a fixed width.
When the page is reduced enough they will automatically stack.
i am looking forward to make a welcome screen of my web app like the picture i shown..
here is a pic of example:
http://img600.imageshack.us/img600/4144/1j5h.png
The truth is i have tested many almost all the panels that GWT has to offer, and still i cannot make it.
For example:
The upper header, i made it with a DockLayoutPanel like this:
DockLayoutPanel Header = new DockLayoutPanel(unit.PCT);
header.setStyleName(¨fw¨);
header.setWidht("100%");
header.setHeight("35px");
header.addEast(ingresar,15);
header.addEast(pass,15);
header.addEast(user,15);
Using that panel, i can have all the 2 boxes and the button on the right corner of the screen, and with AUTO-WITDH.
*(even i cannot pad the red button)..
As you can check the horizontal Center Panel has a different style, i create it as Horizontal Panel, but when i do :
header.add(center_panel);
It is useless, the css from header will ofuscate the css from horizontal panel, also i cannot get the box right in the CENTER.
i have zero experience in GWT, i would like if someone can tell me the way, because i am using panels and i am not quite sure that i am using the right ones for this tasks, or the best ones.
THanks very much
Facundo
If you don't have much experience in GWT components try creating the UI with using GWT UI Binder. Its much more similar to creating a layout with html and css. Also you can use most of the html elements such as divs,spans etc.. GWT Uibinder
You can give styles on individual panels like,
for horizontal,
HorizontalPanel hp=new HorizontalPanel();
hp.setStyleName("");