How to scale text in html? - javascript

Hello I was wondering how to scale text with html. My text looks very large when I make the page smaller. Is there a script or a command that will scale the text down along with the page size?

Well you can use css to change the font-size, if that is what you are referring to.

Your question has me a little confused, but it may just be the way you are phrasing it.
Are you saying that you want the browser to "resize" text, headers, and other content depending on the browser size?
If so, what you are referring to is called responsive design.
Here is a DEMO of a site using this responsive design. (Make the screen bigger/smaller, and let me know if this is what you were trying to achieve)
http://webdesignerwall.com/demo/adaptive-design/final.html
Here is the tutorial behind this demo:
http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

Related

Make Element Full Height of Page on Bubble.is

How can I make an element the full height of a page on the website editor of bubble.is. So, when opening the page on differently sized computer screens, my element would always cover the full height of the page. An example of this effect is https://kickpoint.ca/contact/
I’m thinking I may need to use html or JavaScript to do it, but I’m not sure how and if there’s a simpler solution.
Thank you
What you actually want for this is css. I would read through a quick tutorial. I am not familar with Bubble.is, however css is for styling webpages. After a simple tutorial you will know exactly how to do what you are trying to do. It would be something like #element-id{ height: 100%}. or on the html element:

how to fix or design the print window of a browser

How to fix this printing layout? is there a way? the text should be aligned left, and the other layout position should be like the original web page,
ive used a javascript which will print only a content from a particular div. but the only problem is this messed up layout.
This is a bit of a link only answer, but you will need to create a print.css style sheet to specifically style the page when printed. I would suggest looking at the following:
http://www.smashingmagazine.com/2011/11/24/how-to-set-up-a-print-style-sheet/
How you style the page is really up to you, which makes this a slightly broad question. But you simply style the elements using their classes/ids much as you would when styling the screen. Hope this helps you move forward.

Facebook likebox - css issue

I am having issue with the facebook like box. The stream isn't displayed correctly. So i wonder if there is a way so that i can customize the the css. I just need to add float:left to a div and it will all be working but i am not getting a way to do this.
If anyone can guide me so that i can have the desired result, that would be awesome.
You can check the current look of the like box Here. If you just scroll down you can see the texts are not displayed correctly.
I tried to design with js and css too but couldn't get it to work.
If you want the text on the right to display properly, you simply need to change the width from 395 to about 480. Or, are you trying to have the text on the right display below the image? You won't be able to handle that unless you are able to manipulate the source of the iframe -- or use JS after the iframe is loaded.

Scale height of div with jquery - How will google react (SEO)?

Suppose I have a big div including much text. I want to show my readers only the first few text-lines. So I thought about scaling down the height of the div with javascript/jquery and add a "Read more" button.
Like that:
$('#content').height(20);
Here's a complete example: http://jsfiddle.net/zvQsX/1/
I guess google will index all the content, but will google interpret this as spam?
Thanks for your help!
Best
Andi
I'm not sure, but I think Google interprets a bit of CSS and display:none and simply would consider a hidden content as non-existent or at-least as less relevant than what you display directly.
Your technique is different and I honestly don't know how Google would interpret it. If we consider the law's intent, you are actually giving your users the whole thing (they can read it if they want and it's on the same page), and it shouldn't be considered as black hat thingy.
That said, why do you want to use scaling of div instead of display:none or text-indent:-9999px ?

Text block width while wrapping floating image

I got some problem with text width while it wrapping floating image. Here is good picture what describe the problem:
This guy post kinda poem, but formatting of his text was broken. His text should looks like this:
I'm already know the source of this problem. It because text block starts behind picture, and while text wrap around picture text block not growing longer and text stay in same bounds like there is no image at all. Here is the example fiddle: http://jsfiddle.net/czqGk/3/ I also add solution in JavaScript what do width compensation for text block.
I'm looking for solution without using JavaScript. Set minimum size of user post, or set another static width is not acceptable. Width should be dynamic and depends from content. Any ideas? :(
Defining the image within the longer text seems to fix the issue; here's a little demo: little link.

Categories