I have embedded a google calendar but I cannot set it so that it is positioned in the center of the page and also not flooding over the top menu.
How do I go about rectifying this?
You can see what I mean by going here:http://lichfieldrooms.uk/calendar.html
Put a text-align:center; in the .block part of the css for calendar.html.
Related
I just want to add a basic banner at the top of my tumblr website. The code (posted below) is just below the <body> part of the html, however I can't figure out why any img link that I put into the 'imgurlhere' section only shows up as a broken icon (see picture).
<a href=“myurlhere”><center><img src=“imgurlhere” width=“500”></center></a>
broken image icon that's showing up
My idea is to upload a short gif to tumblr, and then copy the code into the html so that it is placed at the top of my website as an advertisement. However, every url I put into the 'imgurlhere' section shows up as broken - regardless of advice I've found online stating that's all one needs to do.
I'm making sure to include the correct link, such as .png etc
And making sure to copy it straight from the 'copy image address'.
Any idea?
Thanks!
I think that setting width="500" in img tag was causing this issue.
-The best way would be to add a class and then set the width of the image.
.image{
width:500px;
}
</center>
Try using your image there and let me know if it works or not.Thank You
This is a continuation of this question where I asked how to center a number (i.e. text return) from the Google Visualization API. The new issue I am having is that I want to show progress bars for a specific piece of data, and I would like to center them. I am using the Bar Format. However, my CSS does not seem to work. I know that I should be able to apply CSS to a specific tag within a named element (or I believe I can).
Here is picture of the current site:
I believe if I can remove float: left; as inherited from the google process and add margin: 0 auto; this will all work. Here is a JSFiddle of my work so far.
Yes, removing the float:left; works well.
With reference to your question How do I center numbers in a table from Google Visualization API?, the solution is simple as stated in one of its anwser.
You need to overwrite the css inherited by the API for the span tag inside the td.
span{
float:none !important;
}
Here's the fiddle for it: http://jsfiddle.net/a8e3re72/5/
is there any way I could pull only a portion of an external website using iframe?
This is the page I am trying to pull..
http://clep.collegeboard.org/search/test-centers
The div I wanted to get specifically is the white box in the center (#mainContentWrapper).
I already have a solution myself although it has some flaws. The trick I made was I made an outer div and disabled the iframe and I tweaked the height/width and the positioning where it would only show that portion ...
#outeriframe
{
width:960px;
height:1415px;
overflow:hidden;
position:relative;
}
#inneriframe
{
position:absolute;
top:-300px;
left:-160px;
width:1280px;
height:1415px;
}
The problem is, if the iframe is too big, the footer would show up, if it's too short, the results would be cut off and you can't see them all...
Is there any way I could get around this? Maybe Hide the footer? or grab only the Div I need? Please help me...
Thanks!
You can't, the same origin policy forbids you to interact with a Web page located in a different domain.
Some techniques like CORS or postMessage allow you to work around this limitation, but require some level of control on the other domain.
I've added this twitter widged to one of the site's i manage and for some reason, in every browser but firefox it looks good but in firefox this happens
bam it jump to the side for no reason i solved this by putting overflow:hidden; to the class textwidget
but then everything is gone in the rest of the browsers?
could anyone help me find a solution for this.
All help is very much appreciated
p.s. the site can be found here
Popdrommen
After successfully defeating your popup window, I have come to a conclusion that something like this should help you:
.textwidget {
clear: both;
}
Best thing to do in my opinion, is create a div, set its size, and then apply the overflow:hidden attribute to it, (remember to position it relativly)
Then inside that div put the twitter stuff.
<div style="width:200px; height:500px; position:relative; overflow:hidden">
<!-- Twitter stuff here //-->
</div>
I recently created a fb page for sharing my photography work. I'm new to iframes n stuff so I did my welcome page via an app provided by wildfire
Here is the link to the page https://www.facebook.com/pages/Bharath-Keshav-Photography/144046682351773
Now, how exactly do i get rid of the vertical scroll? The app specifically says that scripts aren't allowed. Also, setting body style="overflow: hidden" isn't allowed as tells me that the body tag can't be used
The best solution would be to use the JS-SDK.
You can either use FB.Canvas.SetAutoResize to have your page automatically resized or, if you know exactly what the height and width of the page will be, use Fb.Canvas.SetSize
You can find more info here: https://developers.facebook.com/docs/reference/javascript/
Also, keep in mind that the maximum width of a page app is 520 pixels and from personal experience, it's best to keep it around 500-510px
You have to make your css in this way
body {
width:520px;
margin:0;
padding:0;
border:0;
overflow:hidden;
}
and use FB.Canvas.setAutoResize();
In this way you can do your tab 520 pixel without scrollbar