|
JavaScript - Alignment
Hey just a quick question... I have something centered on my page (its a table). How can I align something to the left of what I already have centered?
Similar TutorialsI've having a problem with alignment on my portfolio. It works in mozilla although you may need to refresh the page, and it doesn't work in chrome at all. does anyone know why? the address is townsendwebdd.com thanks, I am totaly stuck Hello everyone, I am new to CSS and am having some difficulties with javascript alignment. I have inserted the proper script into my banner and it is in the proper spot but its too far left. I would like to be able to move it into the center. What should I be adjusting? Not really sure how padding etc all works and not sure if that's how i would go about fixing it. Thanks Hello, I'm using the jk mega menu found at: http://www.javascriptkit.com/script/...megamenu.shtml My menu is about 600px wide. When I resize the browser window smaller, the menu seems to auto adjust to the new window size and aligns the menu bottom/ extending left of the anchor, as opposed to the default (bottom/extending right.) I'd like to force the menu always extending right because extending left is sending it off the page left. Collapse this window smaller and roll over the menu and you'll see the issue: http://www.javascriptkit.com/script/...megamenu.shtml Thanks for any help you can provide and I appreciate your time, I wasn't sure whether this needed to go in Javascript or in CSS. In the code I have below, I have a popup box that's displayed via javascript. It is supposed to be displayed in the center of the screen no matter what the location of the link is when it is clicked. All the JS part works fine, I believe the issue is in the HTML/CSS itself, but I'm not sure. As it is now, it works fine on IE, and everything is aligned properly, but it is offset to the right (by roughly 150px or so, I think) in Firefox. However, if I uncomment the line that is commented out (which would define the "right" attribute" of #outside and #behindoutside, instead of leaving it to default), the problem is reversed. Does this have something to do with a difference in FF/IE's handling of the "position" attribute in CSS? That has been my best guess so far but I still haven't been able to fix the error. Also, the box does not appear to fade in/out at all in IE. This is less of a concern to me than the alignment, but still somewhat of a problem. EDIT: I've come up with a (hopefully temporary) solution of using an if statement to determine if the browser is Firefox, but I would prefer to fix the actual source issue instead of just fixing the problem is causes.so Code: <html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title>Untitled Page</title>
<script type="text/javascript" src="http://207.200.19.180/images/10000/6000/170BE/user/jquery-1.3.2.js" /></script>
<style type="text/css">
#behindoutside{
opacity:0.90 !important;
text-align: center;
position: absolute;
width: 100% !important;
z-index: 0;
}
#x{
filter:alpha(opacity=90) !important;
opacity:0.90 !important;
}
#image{
filter:alpha(opacity=90) !important;
background-color: silver;
border: 1px solid black;
width: 100%;
height: 100%;
}
#insidebehindoutside{
height: 420px;
width: 550px;
}
#outside{
width: 100%;
text-align: center;
position: absolute;
z-index: 1;
}
#popup{
text-align: center;
height: 420px;
width: 550px;
}
</style>
<script language="javascript">
$(document).ready(function(){
$('#start').click(function(){
$("#outside, #behindoutside").fadeIn('normal');
var boxheight = $("#insidebehindoutside").height();
var tall = jQuery(window).height();
var scroll = jQuery(window).scrollTop();
var heightShift=((tall/ 2 ) - (boxheight / 2 )) + scroll;
$("#outside, #behindoutside").css("top", heightShift);
//$("#outside, #behindoutside").css("right", "2px");
});
$('#x').click(function(){
$('#outside, #behindoutside').fadeOut('normal');
});
});
</script>
</head>
<body>
<div id="behindoutside" style="display:none;">
<center>
<div id="insidebehindoutside">
<img id="image" src="http://207.200.19.180/images/10000/3000/914BE/user/blank.png"/>
</div>
</center>
</div>
<div id="outside" style="display:none;">
<center>
<div id="popup">
<img id="x" style="float:right; position: relative; right: 5px; top:5px; cursor:pointer;" onmousedown="getElementById('x').src='http://207.200.19.180/images/10000/6000/170BE/user/xdown.gif'" onmouseup="getElementById('x').src='http://207.200.19.180/images/10000/6000/170BE/user/xup.gif';" onmouseout="getElementById('x').src='http://207.200.19.180/images/10000/6000/170BE/user/xup.gif'" src="http://207.200.19.180/images/10000/6000/170BE/user/xup.gif" />
<br><br>
<p>Popup Content</p></div>
</center>
</div>
<div>
<center>
<font size="3">Supply Lists</font> <hr align="center" width="25%" />
</center>
<p align="center"><a id="start" style="color: blue; text-decoration: underline; cursor:pointer;" onclick="appear();">Click for popup box!</a></p>
</div>
</body>
</html>
I would like to change the alignment of an image which currently under div which is under iframe. the page which is called under iframe is readymade html from some other site. I dont have any control on that HTML page which is under iframe. Please tell me how to align image under iframe.
|
|||||||