nidhi

i want to know how people do reformatting of web pages for mobile devices....there r some specific mobile sites, i agree but there r some people who gv such services after subscribing (some charge)....they reformat the page on the fly....how they do that? .....like 'Skweezer' <www.skweezer.net/> providing wireless web services and applications ..if u hv any idea hw to approach reformatting of already existing web page...plz help me....u r also welcome with ur new innovative ideas if u think they r feasible.....

thanx for ur reply....i m asking that i was trying to change d layout of a html page by removing the <td> tag....since <td> will not b present, so the table formatting will not be implemented...everything will come as raw data. if u hv time try to help me...what i want to do is reformatting a html pages into a single column.for this i hv done following steps:1) remove all the external links for CSS from the original web page..2)attach my own CSS.i m trying to resolve the table into a single column bt stuck in between.hw to do that??? if i remove the <table> tag or <td> tag then will it work?plz suggest me.

i m a beginer....can u tell me if i omit the starting <td> and then some data is there an d at last i close the tag by using </td> at the end of the data then wat will happen?for eg:<table>this is just an example</td></table>will the data b displaced? will the ending </td> be recognized?

can anyone tell me when to use class and when to use id?is id also used to apply our style? class can b used any no. oftimes that i knw, n i think id can used once. what other differencesare there bw class n id?

can anyone tell me when to use class and when to use id?is id also used to apply our style? class can b used any no. of times that i knw, n i think id can used once. what other differences are there bw class n id?

agree

<{POST_SNAPBACK}>

i apologize for that bt i didn't used space there, it was a mistake commited while typing'anyway, its nt working, flash is not being resized. its present there in its original size only. wat to do?

How about just

object {height:176px;width:176px;}

<{POST_SNAPBACK}>

i m sorry to say that this also didn't work!

can u tell how to resize an already formatted flash using external style sheet, i.e. by making change in external stylesheet

Try this out

object .flash {height: 176px;width: 176px;}

<{POST_SNAPBACK}>

oops, it didn't work!!!

Actually in the above case, the star is a universal selector... let's analyze:

 * > #footer, * > form, * > #notes, * > .output

The "," is used to state that both of the "paths" are applyed, the same way as you'll say

div, span

Which would apply the style to all divs and spans.The ">" is used to state the only the first element of that kind should have the desired style. Like

span > p

Would only apply the style to the first "p" element which is a child of a span.As mentioned, the star in this case is a universal selector, which in other words means "any element". Combining all theese:

* > .output

Applyes the style to the first element with a class "output" which is a child of some element (in other words: the first on page ?).

* > #footer

The first element with ID of "footer" on page? What the heck? IDs should be used once, therefore, such kind of selector SHOULD be useless.How to hide Flash... well, the same way you would hide any other content... use "display:none", like this:

@media handheld {object.flash {display:none;}}

Where "@media handheld" is the way you specify that only handheld devices (such as cell phones, but also includes PDAs I think) should use the described code inside the parenthesis. "object.flash" is only a sample of selector to select the flash content of course. You'll have to change it to select the actual element in which the flash resides.

<{POST_SNAPBACK}>

thanx a lot for explaining so clearly. object.flash {display:none;}this is working bt object.flash {width:176px;} is not working, its going beyond the limit. what to do?

Well, here is the page about media types:http://www.w3schools.com/css/css_mediatypes.aspYou should probably either test the page on a handheld device, or use something like Opera, which will render the page as a handheld device if you press shift-F11.  That way you can see what you are developing, and change things until you have it the way you want it.  None of us knows what you want the page to look like, you know?

<{POST_SNAPBACK}>

i apologize if i m eating ur head. actually i only want that when i browse internet thru mobile, the web pages should appear same as they appear on desktop pc. and i want to write my own CSS for that.

thanx a lot, it worked

<{POST_SNAPBACK}>

one more query, how can i make flash to fit on a mobile screen if originally its size is greater than mobile screen say width is 176px.

This is the code to not display flash objects

object .flash {display:none;}

Just put that at the end of your css code. Everything else should be fine I believe.

<{POST_SNAPBACK}>

thanx a lot, it worked

What are you using to place the flash on the page? If you post your code and the css, you are guaranteed to get more reply's. For now, I am going to assume you used the object tag, since most people do. I believe you can have it not display if you do this in the CSS

@media handheld {object .flash {display:none;}}

Edit: Thanks to boen_robot

<{POST_SNAPBACK}>

i m attaching a CSS using link. if using external style sheet, thn we should link CSS like this:<link rel=\"stylesheet\" type=\"text/css\" href=\"handheld.css\" />we use @media handheld when we have CSS in the same html na? in my CSS, wat should b done to make a web page compatible to a mobile screen.give me some guidelines...i m giving my code, plz hv a look over it. it works fine for simple pages, bt not for heavily decorated pages. i don't want to display flash objects, hw to da that?just tell me that writing in this way is OK? if i specify width in body, then will that b applicable throughout the page or i shall take some other approach?body { width: 176px ; /* nokia 176px screen */ border: thick solid red /* just to see the 'screen' limits */}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(body):not(img) { /* the negated ID selectors above are here just to increase specificity */ width: auto ! important ;}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId) { /* the negated ID selectors above are here just to increase specificity */ position: static; float: none; text-align: left; padding: 0px; margin: 0px; top: auto; left: auto;}table,tbody,thead,tfoot,tr,td,th,col,colgroup { display: block;}iframe { display : none;}li { list-style-position: inside;}img[width=1] {display: none}var l = document.getElementsByTagName('img');for(var i = 0;i < l.length; i++) { if(l.width > 176) { l.height *= 176 /l.width; l.width = 176; } else if(l.naturalWidth > 176) { var e = 176 / l.naturalWidth; l.height = l.naturalHeight * e; l.width = 176; }}

Oh yeah, that's right.  Brainfart.

<{POST_SNAPBACK}>

well, leave C coding...u r correct, i m attaching a CSS using link. if using external style sheet, thn we should link CSS like this:<link rel=\"stylesheet\" type=\"text/css\" href=\"handheld.css\" />we use @media=handheld when we have CSS in the same html na? in my CSS, wat should b done to make a web page compatible to a mobile screen.give me some guidelines...i m giving my code, plz hv a look over it. it works fine for simple pages, bt not for heavily decorated pages. i don't want to display flash objects, hw to da that?just tell me that writing in this way is OK? if i specify width in body, then will that b appicable throughout the page or i shall take some other approach?body { width: 176px ; /* nokia 176px screen */ border: thick solid red /* just to see the 'screen' limits */}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(body):not(img) { /* the negated ID selectors above are here just to increase specificity */ width: auto ! important ;}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId) { /* the negated ID selectors above are here just to increase specificity */ position: static; float: none; text-align: left; padding: 0px; margin: 0px; top: auto; left: auto;}table,tbody,thead,tfoot,tr,td,th,col,colgroup { display: block;}iframe { display : none;}li { list-style-position: inside;}img[width=1] {display: none}var l = document.getElementsByTagName('img');for(var i = 0;i < l.length; i++) { if(l.width > 176) { l.height *= 176 /l.width; l.width = 176; } else if(l.naturalWidth > 176) { var e = 176 / l.naturalWidth; l.height = l.naturalHeight * e; l.width = 176; }}

i m trying to format an already existing web page by linking a CSS at the headusing a code in C, so that it fits for a handheld size.in C code, i m opening that webpage and start reading char by char. as soon as head tag comes,i concatenate thelink as a string. the CSS is being successfullyattached and the contents are fitted into the specified screen size: 360*240. then istore the result into a htm file.but some entities are creating problem especially flash. i don't want to display flashon the mobile screen,hw can i do it using CSS.can u gv me correct guidelines wat should i hv in my CSS to reformat analready existing web page.plz help me, i m stuck in between.if anyone shows interest,i'll send my CSS code alsowaiting 4 ur valuable reply,

The * is used to make it so the css that folows is only picked up in IE and not Firefox. You have to use hacks like this as diffrent browsers interprate CSS differently.The # is used to say the CSS that follows is and ID. An ID is the same sort of thing as a class but an ID can only be used once on each page where as classes can be used multiple times. ID is also more likley to work in certain situations but you wont need to worry about that unless you plan on doing some programming too.

<{POST_SNAPBACK}>

i m trying to format an already existing web page by linking a CSS at the headusing a code in C, so that it fits for a handheld size.in C code, i m opening that web page and start reading char by char. as soon as head tag comes,i concatenate the link as a string. the CSS is being successfully attached and the contents are fitted into the specified screen size: 360*240. then i store the result into a htm file.but some entities are creating problem especially flash. i don't want to display flash on the mobile screen,hw can i do it using CSS. can u gv me correct guidelines wat should i hv in my CSS to reformat analready existing web page.plz help me, i m stuck in between.if anyone shows interest,i'll send my CSS code alsowaiting 4 ur valuable reply,

* > #footer, * > form, * > #notes, * > .output { position: relative; z-index: 1000; }why it starts with '*' sign?why '>' is used?wat purpose does this solves? #header { overflow: hidden; }what " # " here means?wat do these signify?

Please don't hijack topics. Make your own thread for your questions. If you want help on AJAX, the JavaScript forum would be your best shot. Thank you.

<{POST_SNAPBACK}>

i request all out there to help me.plz tell how to reformat a html page for small screensby externally attaching a CSS thru a code in C

First you should validate all your pages to XHTML 1.0 Strict. All the relatively new cell phones should be able to parse correct xhtml. Then, you should use css to format the html. To get a different display on a cellphone than on a computer, you can import different css files depending on the detected media:http://www.w3schools.com/css/css_mediatypes.aspSo, "handheld" would be for example a cellphone, and you could have smaller values for that than "screen".

<{POST_SNAPBACK}>

i hv used a C code to read the input html code from a web page,then i hv linked an external style sheet at the head and stored the resultant code into another file.here is my code:

void main(){	char ch,tempch,tempch2,word[10],inbuf[24817],outbuf[24817];	int inccnt,outccnt,i,j,k;    FILE *fp, *fp2;	char tbstr[70]="<link rel=\"stylesheet\" type=\"text/css\" href=\"test2.css\" />";	    	int flag=0; //flag for <td>		fp= fopen("news.htm","rb");	if(fp == NULL)	{		printf("file1 not opened\n");		exit(1);	}	fp2 = fopen("out.htm","wb");	if(fp2 == NULL)	{		printf("file2 not opened\n");		exit(1);	}	fread(inbuf,24817,1,fp);	fclose(fp);	strlwr(inbuf);	i=0;	j=0;	while(j!= 24817)	{		ch = inbuf[j++];				if(ch=='<')		{			outbuf[i] = ch;			if(((ch=inbuf[j++]) =='h'))			{						k=0;						i++;						outbuf[i++] = ch;						for(;k<3;k++)						{							word[k]   = inbuf[j++];							outbuf[i++] = word[k];						}							word[k]   ='\0';						if((strcmp(word,"ead"))==0)						{							while((ch=inbuf[j++]) !='>')								outbuf[i++] = ch;							outbuf[i++]=ch;							outbuf[i]='\0';							strcat(outbuf,tbstr);							i=i+strlen(tbstr);						}			}			else			{				i++;				outbuf[i++] = ch;			}		}		else		{			outbuf[i++] = ch;		}	}	outbuf[i++] = '\0';		fwrite(outbuf,1,i,fp2);	fclose(fp2);}

well, you could make a printer friendly version with just text, or you could use percentages.LG

<{POST_SNAPBACK}>

thnx for ur reply.if i use only text then mozilla is supporting but IE is not working.i hvsend my code, plz go through it and tell me where i m wrongand hw to rectify it.can u suggest wat needs to b done for images?body { width: 176px ; /* nokia 176px screen */ border: thick solid red /* just to see the 'screen' limits */}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(body):not(img) { /* the negated ID selectors above are here just to increase specificity */ width: auto ! important ;}*:not(#ImPoSsIbLeId):not(#ImPoSsIbLeId):not(#ImPoSsIbLeId) { /* the negated ID selectors above are here just to increase specificity */ position: static; float: none; text-align: left; padding: 0px; margin: 0px; top: auto; left: auto;}table,tbody,thead,tfoot,tr,td,th,col,colgroup { display: block;}iframe { display : none;}li { list-style-position: inside;}img[width=1] {display: none}var l = document.getElementsByTagName('img');for(var i = 0;i < l.length; i++) { if(l.width > 176) { l.height *= 176 /l.width; l.width = 176; } else if(l.naturalWidth > 176) { var e = 176 / l.naturalWidth; l.height = l.naturalHeight * e; l.width = 176; }}

i m writing a code to format a html page so that it fits a mobile screen size.all text or image or table, frames etc should be within that screen size.can u gv me an idea what logic should i use! if i use CSS thn what changes should be applied. i m writing a code in C,either i can use an external style sheet or by just reading the html code ad making some changes n then again writing the whole content into another file will do . plz suggest me any logic.thanx a lot,