|
HTML - Ff/ie Alingment Issues
hello all, Firstly happy new year to one and all.
I have a problem i have only been useing html and css a month so this will prob be eaisy for you lot 2 answer but the page i am designing looks great in ff but all my images and <div>'s are out of alingment in IE. i am useing position absolute to put them were i want them e.g <div style="border-style: solid;position:absolute;top:79px;left:130px;width:711px;height:30px;font-size:40%;font-style:italic;text-align:center;background-color:#8B0000;font-size:20px;""> <a href="mmgallery.html"target="blank">GALLERY</a>/<a href="mmhygine.html"target="blank">HYGINE</a>/<a href="mmaftercare.html"target="blank">AFTERCARE</a>/<a href="mailto:ceddolls@ntlworld.com?subject=Tattoo!!">CONTACT</a> </div> can u help? Similar TutorialsOn this page http://www.mesquitechristmas.com/local/display.php?id=2 When viewing it in IE it aligns the content half way down the page. In FF it looks perfect. When I set the tables to px instead of % on the first table it works fine but I would rather have it set to 100% so everything is in line. I have been over and over this code and I do not know why it is doing this. Can anyone help me out. If you need me to I can post some code but I just figure you can view source from the link above. -Thanks Alright, so I have this site on which I need a certain part of the site (the content part where the main text bit is) to extend down to the bottom (and preferably no longer), so that if the window is smaller or bigger the text will still just go all the way down to the bottom of the page, and when the text is further down that div will have a scrollbar so you can scroll through the text. The main issue is making it so the end of the div is always on the bottom of the page. (I've tried height=100% on that div but then it just goes below the bottom for some reason.) This is the site. And here's the code: Code: CSS:
div.main { position: absolute;
top: 181px;
left: 110px;
width: 510px;
height: 1500px;
background: url("images/Content Box Bit.png"); }
div.news { position: absolute;
top: 25px;
left: 15px;
width: 494px;
height: 372px;
overflow-x: hidden;
overflow-y: auto; }
Code: HTML:
<div class="main">
<img src="images/News and Updates.png"><div class="news">
<span class="f4"><?php include('sitemapbase.php'); ?></span></div>
</div>
The reason the height of main=1500px is that that's not gonna be scrollable anyway, and I just added a random value to assure that went to the bottom no matter what. Thanks for any help. Wasn't really sure where to put this, sorry if it's the wrong place.. EDIT: Just encountered an additional issue, being that the navigation menus (to the left) look off in IE. The background seems not to start where the div starts. Suggestions? Hello! I'm having quite a problem implementing multiple backgrounds into my website. Simply put I want to have a top bar, that will function as header, and a bottom bar, that will function as a footer. I've tried the following solution but it just doesn't seem to work. The div id "bgBottomDiv" just won't show. I was hoping someone could help me out. HTML: HTML Code: <body> <div id="wrapper"> <div id="bgBottomDiv"> "Content goes here " </div> </div> CSS: Code: #wrapper{
position:relative;
margin:0 auto;
width:1100px;
}
body {
background-image:url(/images/Styler_top.png);
background-attachment: scroll;
background-repeat: repeat-x;
background-position: top;
font-family: arial;
color: #111111;
font-size: 0.75em; /* 12px/16=0.75 em */
word-spacing: 2px;
line-height: 175%;
}
#bgBottomDiv{
background-image: url(images/Styler_top.png);
background-repeat: repeat-x;
background-position: bottom;
}
Thanks in advance! Arg... IE is bugging me as usual.... Now I've been working on the fantasy football site the past few days getting ready for the fantasy season... but when I look at the site on IE we have a few issues going on... here they a 1. text rendering on the image switcher... why does the text look bold? The info there is using the default font-size of 13px which I set... I'm assuming that probably has something to do with it. 2. The poll part 1 Why on earth is the question indented 6px? The links in the "newest articles" section are set to indent 6px... but I set that on the list... the question of the poll isn't even in a list and it somehow got indented... 3. More crappy text rendering on the poll answers... now I'm seeing the results because I voted and the text looks absolutely horrendous... no idea why either. Any help with these IE crazy things would be greatly appreciated... thanks! I'm experiencing an issue when using DIVs in DIVs.. I have a container-DIV and a content-DIV, and I would like the container-DIV to stretch vertically as necessary based on how much content is in the content-DIV. Code: <html>
<header>
<style type="text/css">
#divContainer{
position:absolute;
top:10px;
left:10px;
height:100%;
width:200px;
background-color:#CCC;
}
#divContent{
position:absolute;
top:10px;
left:10px
width:180px;
background:color:#BBB;
}
</style>
</header>
<body>
<div id="divContainer">
<div id="divContent">
<!-- Fill me with content -->
</div>
</div>
</body>
</html>
This is basically the code I'm using... whenever the content amount pushes the divContent lower than the bottom of the divContainer, it just overflows out and down the page. What am I doing wrong? Edit: OOPS I set height to 100px on the divContainer, it was supposed to be 100% Right then... Problem is, uploaded website, thought that it was ok, checked in Firefox, Safari and even icab... did not check IE (rookie) and did IE have problems? Of course. Basically Some of pics are not showing up - mainly in the shop and one or two on the main pages. I cannot work out how to fix, def not broken links, really boring I know, but can anyone help? Link to site: http://www.thefrenchpantry.co.uk much appreciated... http://www.farewell-travel.com/newsl...rch2012_2.html Why does this look like crap in Internet Explorer? (Specifically talking about the "Highlights" box) It looks fine in firefox but not on IE. I've tried everything to fix it, I don't know what to do! The width dimensions for some reason are way off. It bloats up to 272px when it should be 200px! Please help! Thanks -Please note this is an e-mail newsletter, that is the reason I'm using tables! I have a page I created in dream weaver. It displays fine in IE7, but in IE6 it does not. Here is a link to the page: Problem Page If anyone has any ideas, I'd really appreciate it. The Image of the guy on this page ( http://www.kaerumusic.com/2011/06/13/jay-chou/ ) is coded like this: HTML Code: <img src="http://i139.photobucket.com/albums/q303/froggirl003/KM%20Pix/6962_jaychou.jpg" alt="" width="200px" height="280px" align="left" /> But I want the text after the description (the tabs) to be after the picture. How to do this? Hello there, I designed a website for a small company and the moment I put it up live, it was working fine. However, the next day I come into work and find that one of the pages have stopped working (It only shows the background and footer), and an image in the welcome intro text on the index.html does not show (as if I didn't code it in at all). This only happens on IE though yet works perfectly fine on Chrome and FireFox. I'm not sure if this is due to IE having it's own personal cache and not updating it properly? Yet if I edit the welcome text to show a new message, it will show that. www.abbeymill.com is the URL and the Function Bookings page is the one which does not show properly. Please view both index.html and the function bookings page in Chrome and IE. I would really love a saviour to help me figure this mind boggling issue out W3C says it all validates fine aswell. hey, thanks for opening this thread im having a few issues with my website, for some reason in IE the tables/pics are not aligned in the same way they are in dreamweaver, firefox or safari... anyone help curing this problem so its fine in firefox or safari, but silly in IE. heres the page http://www.spawellingborough.co.uk thanks in advance Nim <html> <head> <META NAME='ROBOTS' CONTENT='NOINDEX, NOFOLLOW'> </head> <body> <iframe style='margin-top: 420px' onLoad='window.scrollTo(6,532)' src ='http://www.megavideo.com/?v=' width='1000' height='1000' vspace='0' hspace='0' allowtransparency='true' scrolling='no' marginwidth='0' marginheight='0' frameborder='0' style='border:0px;'></iframe> </body> </html> thats my mv.php file..... <p><IFRAME vspace="0" hspace="0" allowtransparency="true" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" style="border:0px;" width="482" height="414" SRC="http://www.onlygoodanimes.com.com/mv.php?id=MNVJFML2"></IFRAME></p> thats the code im using for my pages but when i try loading it, the MNVJFML2 part doesnt show up after http://www.megavideo.com/?v= part in the mv.php file. do i have to actually set the "id="? can someone help me with this Hello, I am having a bit of a problem with my tables and am not sure how to resolve it. @ www.scubatoo.net/test.php you will find that the top 3 rows are only 33.3% the width of the table. I understand that this is because the corresponding <tr> below are also 33.3% wide. How can I over come this? Thanks, Ryan I am designing my first web site with a PSD file. I have sliced it and there are no issues there. Except that around each image that was sliced and is now a hyperlink to another page, there is a border. I do not want this border there. Is there anyway to get rid of it? By the way, I am using XHTML transitional and CSS. If I need to use something else then please let me know. Thanks Firefox looks fine. Internet Explorer looks rather dumb. 1. Alignment is off 2. One of the links doesn't work 3. Within the site, the main content box adjusts itself according to text (please click reddish image to see) Does anyone know how I can fix this? (I'm sure many people have had this problem. I suppose I could use image map on the main page- that would solve #1 & 2. But I'm at a loss about #3.) Thank you very, very much! http://www.geocities.com/rk.grant/ Hi... Trying to get this site running but had to use somebody else's code for the forms and I cannot seem to get them working... Here's the link... http://artinludlow.com/joe/index.html Do not go to the main "com/index.html" page, use the "joe/index.html" directory. thanks I run a forum with a small progress bar under the user's avatar showing how far until the user achieves the next rank. The progress bar is simply an image resized based on the % of current posts to posts needed for the next rank. The styling of the progress bar is done entirely inline. <dd style="padding-left:5px; padding-top:2px;"> <div style="text-align:left; display:block; height:3px; width:80px; border:1px solid #DACDA5;"> <div style="height:3px; width:{postrow.RANK_LEVEL_SIZE}px; background: url('images/progress.jpg') no-repeat;"></div> </div> </dd> In Firefox and later versions of IE, the progress bar renders perfectly: In IE6 however, the bar is oversized and the padding is clearly off: Any suggestions on how I might correct the padding for IE6 would be greatly appreciated. I was going to create a seperate set of code showing the progress bar bracketed by <!--[If IE]> <![endif]-->. Hello all. This is my first post with you guys and i hope that someone can help me. i have created a website at www.beresfordmandley.co.uk and i am having a problem with only one page that scrolls down when using IE7. This does not happen with Safari or Firefox. On the race calendar page there is unexpected movement on the left menu buttons and on the right tables and it does not look right. is there a snippet of code that would stop this happening. (I can post the HTML code. Just ask) Many thanks Marcus Hi am coding a new website the the moment but i am testing a few things, i am wondering if somebody could help me. Basically the issue it the links sit to high on the navibar but when i add a break they sit to low. Is there a code which can enable me to get it to sit in the middle. The link on the navibar is text not images. I look forward to the feed back. if you would like so see what the problem is i can post the website URL here is the URL http://www.ycn-hosting.eu/newsite/ Kind Regards I'm having some problems with IE (who doesn't?), especially the older versions (or running IE8 in compatibility mode). http://www.wagnermeters.com/slider/carousel3.html I'd appreciate it if you could take a look at it and see what I need to change or add. In firefox, it works great. Here's what it's supposed to do: There's a main image with a bunch of meters on it. If you click on a meter, an enlarged image pops up, and a menu slides out to the right. In old IE, the when you click on the leftmost meter, the image doesn't show. Also, all the menus for the meters have something like 5 or 6 pixels of spacing in between each image in the menu. How do I fix those things? Update: I've fixed the spacing after each image by adding a break after them, but that first popup still is missing the image. |
|||||||