table for multi device - html

I am trying to create a long table, 10*10 cells. It looks good in desktop but I want to display the same table code to be used for mobile and ipad. Is there a trick to use single code for table for desktop and mobile?
The major issue I am facing is that the table needs to be accessible, and should work with non js version.
I tried to search but many have posted that they use different table for different devices, which I don't want to do.

As far as I know it would be difficult to do it with plain HTML/CSS. By introducing a scripting language, it should be easier to implement. Look at the following link for more info
A request to the server contains all type of info in it, where it is coming from, which browser they are using and which type of device it is. You should be able to utilize it. Again you have to use script. You can also use JavaSacript but since that is not your option, Script will the only way to do it. Such as PHP, ASP.NET or any other that you are using.

Related

How can I pass form data from one html file to another without JS/PHP?

I'm learning basic web dev and started with HTML, CSS, Bootstrap. Haven't touched PHP or anything server side yet.
What I've done so far is I've created a pretty basic registration form with 5 fields and what I'm trying to do is display the input of those fields in a table that I've created on another page. The submit button has the "method" and action. Now, I've Googled a ton to find some solutions and have gone through most of the questions of this site but I still can't find out to achieve what I'm trying to do without the use of PHP/JS.
So, is it even possible to read form data from another page like this without the use of JS/PHP? If so, how do I proceed and what needs to be done? I can post the source code but I don't think it's going to help since there isn't much there, everything else is working fine except for finding a solution to this.
Thank you.
You need a programming language.
If you want to do it entirely client-side, then that has to be JS.
If you want to do it server-side (which allows you to access the data and, optionally, make it available to other people, instead of limiting it to the user of the browser) then you can use any programming language at all (although JS and PHP are among the most common choices).
Since you are trying to create a registration page, you'll need to use server-side programming.
You necessarily need to use JavaScript / PHP.
Since you are just starting, I would highly recommend you to check out the W3Schools tutorials on HTML, CSS, JavaScript, PHP, Bootstrap and jQuery.
:)
So this is long gone but I was actually able to resolve my problem without using anything other than basic HTML , so here's how I did it for anyone else who's trying to find the answer to problem (probably not, you don't usually do this professionally and basically this was a challenge from a friend).
So, two things.
SessionStorage
LocalStorage
This is built-in to your browser and you can use it to achieve simple tasks by simply assigning values to it. They'll remain there and you can use however you want.
But, as the name implies, sessionstorage will only retain those values during the session (the time you have your browser open for) while localstorage can retain it indefinitely. Not sure if I can link other sites over here so just Google these terms to learn more and how to use them.

HTML printing - what methods are there to make an html based printout? What are the pros and cons?

I have a report I need to print out in an application I'm usually doing maintenance for. My question, which interests me beyond the scope of this task is, what are the ways to format an HTML page for printing? What are the pros and cons of each?
Note that the page is meant only to be printed. I'm not asking about an HTML page that looks ok also when printed.
Generally speaking, I know I can either rely heavily on <table>s or on <div>s, but I don't know which way to go.
I would also appreciate some resources to get me started, or to help with known problems, in any method you suggest.
Thanks,
Asaf
As you can certainly see, printing and web presentation are two different creatures. The main issue is the bounds of the printed page, which does not exist in a web page. Even if you think you have a page laid out in a manner that will fit a printed page, then you need to deal with the fact that the font you are using may not work or scale correctly on the user's printer.
I know of three ways to deal with this issue:
Use fixed-sized fonts (like Courier), limit yourself to an 80 column width, and only use font characters: meaning use something like asterisks for borders, etc. This is VERY old school - your reports look simple and old and plain. But, they will always print they way you intended.
Convert your report to an image. Images can be made to confirm to a specific size which can fit on a page. However, you can still have issues due to printer margin settings.
Let another application do the work for you. What I mean by this is put your report into a PDF or a spreadsheet. Both PHP and Perl have easy to use modules for creating a PDF - with no licensing needed. Perl has a fantastic spreadsheet module. This route takes a little learning up front, but frees you from having to be an expert on printing (which can be a real pain).
In case you DO want to have a page that also looks good when viewed in a browser, consider multiple stylesheets for different medias.

Modify Google Chrome or Mozilla Firefox display settings

I would like to know if it is possible to modify Chrome or Firefox display settings, so that it would only show rectangles of HTML DOM objects? What I want to do is to decrease rendering engine job amount as much as possible, so it would only build layout of the page.
People usually refer to this mode of operation as "headless" (i.e. without UI).
Usually there's an additional requirement - to be able to run it server-side without the usual for client software installed. If you're running it client-side, I wouldn't bother about optimization, it shouldn't give you a big win anyway.
Otherwise, try searching using that term. I've seen it asked for several times, but haven't seen a working out-of-box solution.
[edit] just saw http://hg.mozilla.org/incubator/offscreen, which seems to be a headless version of Mozilla.
I wouldn't go as low-level as modifying the renderer. Instead, I suggest you use Firefox's Greasemonkey to replace the elements from the page with whatever it is you need. You'll need to know a bit of JavaScript, but it's not that hard.
However, this will only work on client side. If you want to do this on server-side ( so that it will work on any page a user requests through your own ), my guess is you'll need to grab the page's content in a string, and then modify it using a HTML parser.

How to verify html DIV's width and height on server side?

I was wondering if it's possible to verify a DIV's width and height on server side (PHP) without running any browser?
It seems it's not possible without writing a parser, which is no worth.
One Rube Goldberg way I could think of is, convert that DIV into html (using html tidy), then into PDF and then get the size. Highly inefficient. Even in that case I'm not sure how I'd set PDF page size.
The real practical problem is that I want to confirm the size of adverts created on client side. Users are charged based on size only. What could be alternate ways to verify dimensions? Don't Google and adready (www.adready.com) do something like this already?
Edited: These ads are template based and customer changes only few TEXT variables.
It's definitely not possible. There is a plethora of client-side settings influencing the ways a page is rendered that you can't control. The only thing you could do is use a service like BrowserShots (http://browsershots.org) to make screenshots of what your sites look like in the most common browsers.
Edit: What you could do, on second thought, is write a JavaScript that determines the size of the elements - easy enough using a cross-browser framework like prototype using .getDimensions() - and send that data back to the server using Ajax. You would have to generate a unique id to identify the callcacks but this should be a good way. It seems a bit of an overkill to use this in a production environment but there are much more resource-consuming Javascripts built into sites every day.

Drag drop block edit in place html

I required to write a small web application that allow customer to select predefined layout template in html and be able to modify it. The application need to allow customer to add block text to pre defined area and images. The block texts need to be able to reorder based on customer need. eg. move up , move down or move to sidebar. THe complete layout will be able to convert to table layout and inline css due to email program doesn't like div & css. I don't know where should I looking for the information to make this happen, could anyone show me how to do this.
Thank you
Of course, I may be misunderstanding you. You might consider using a standard content management system such as:
linux based
joomla
Mambo
Windows based
DotNetNuke
Sharepoint
Those systems have the functionality you described built in with the added benefit that most of them are free and open source.
I'm not sure why someone downvoted you, but check out a javascript framework like script.aculo.us or Yahoo's YUI
Those will go a long way towards creating the interface you need. Also they have a lot of examples.
The Yahoo framework has an inplace html editor (I think that is what you are asking for). Another editing is the fckeditor.