|
HTML - Annoying Layout Problem.
Here is my site at current: www.omgpcgames.com
When viewed in high resolutions, the page streches - I don't want this to happen. Instead, I want the layout to remain in the center, and the two sides open up to reveal a blank background. My reasoning? See this On the left is what it looks like in a high resolution, on the right what I want it to look like. Any ideas on what I can do? It's a joomla site - so that may complicate things slightly. Similar TutorialsNo idea how to even title this thread (sorry). When viewing particular pages, the entire content of my site shifts over to the right about 4/5 pixels. I've noticed that this happens whenever the page has a table within a table. Code: body {
_text-align:center;
_font-size:125%;
text-align:center;
background-color:#000;
color:#999;
font-family:'Lucida Grande',Tahoma,'Lucida Sans','Trebuchet MS',sans-serif;
font-size:62.5%;
line-height:1.4em;
}
/* Main elements */
#container {
#overflow:hidden;
margin:0 auto;
overflow:hidden;
padding:0 8px;
position:relative;
text-align:left;
width:980px;
Is the problem there or elsewhere? thanks I have this very annoying problem with my website which i can't seem to solve. I've built this site with Dreamweaver and somewhere along the way this happaned: http://www.kobiversano.com as you can see, there is this black line on top of the gray background on the right side of the page and on the bottom. How the hell do i remove it? Thanks in advance. Super annoying problem with Firefox portable? I've been using it for almost a year with no problems. All of a sudden my bookmarks take me to completely random RSS bookmarks. In other words, I'll click on a bookmark for Yahoo answers and it takes me to a BBC new article that I don't have bookmarked but is on my RSS subscription. I've tried deleting the bookmark.html file and replacing it with an older backup bookmark file but it doesn't work. If I bookmark something today, tomorrow it will take me to a different site altogether. Any help would be greatly appreciated. _________ Hi, There may be an easy solution but ive spent over 3 hours trying to correct this now. Basically i have 3 pages, each of which i 'saved as' to ensure the basic layout was identical. When the pages are aligned left they are all perfectly aligned, however as soon as i align them centrally, the heating and plumbing pages, for some reason indent themseleves slightly right compared to the bathrooms page. This is so frustrating. Can anyone see why and offer a solution to get them all aligned perfectly central? Thanks!! P.S. I think i may have wittled this down to a problem with the main content area, it seems when i apply the css h2 tag or remove the image it suddenly jumps. I have got them all aligned perfectly centrally before with no css in the main content area. any ideas? Hello, First post! I'm going to start out with a stupid question (because that's what you do when you're a noob). I realise what I am trying to do is very basic, but I cant work out what I should google to achieve it. We have a website - www.rosietheband.com - which is incidentally my first site (the dimensions are a bit messed up atm, I changed a few bits and I haven't quite finished tweaking). At the minute I'm using a really awful flash-based flickr plugin for the photo page, which I'm not enjoying at all. I want to replace it with a really simple gallery consisting of lots of little 100x100 thumbnails (with no spaces) that completely fill the screen (no matter what your screen size is). As I click on them I'd like a larger version to pop-up (I should probably stick a header in so you can get back to the site). I'd rather not use flash. It sounds easy, but the more I think about it, the more I'm dreading the task. It will contain hundreds of images. Generating the thumbs will be no problem, but how will I implement a pop-up for each one? and how will I add new images without editing the code? If anyone could help in any way I'd really appreciate it! (also, any comments on the site itself would be welcome!) All the best, Rosie I can't get my buttons to work in IE (workd in FF btw) I'm pretty sure the problem lies in the following code Code: <style type="text/css">
input.groovybutton
{
font-size:21px;
font-family:Comic Sans,Sans-serif;
color:#FFFFFF;
width:138px;
height:44px;
background-image:url(background/buttonnorm);
border-style:none
}
</style>
<script language="javascript">
function goLite(FRM,BTN)
{
window.document.forms[FRM].elements[BTN].style.color = "#AAFFFF";
window.document.forms[FRM].elements[BTN].style.backgroundImage = "url(background/buttonon)"
}
function goDim(FRM,BTN)
{
window.document.forms[FRM].elements[BTN].style.color = "#FFFFFF";
window.document.forms[FRM].elements[BTN].style.backgroundImage = "url(background/buttonnorm)"
}
</script>
<form name="groovyform1" METHOD="LINK" ACTION="BDT_main">
<div style="position:absolute;top:220px;left:22px">
<input type="submit" name="button1" class="groovybutton" value="Main Page" title="The Main Page" onMouseOver="goLite(this.form.name,this.name)" onMouseOut="goDim(this.form.name,this.name)">
</div>
</form>
Any help you can spare would be greatly appreciated I think it may have to do with changing <style type="text/css"> to something else like div, cause thats what i did to my text and it fixed it. I just dont know what to change it to For some reason there is a large blank area between the form and the caption on this page. It's most likely a simple edit, but i can't figure it out Any help is greatly appreciated. http://www.blackwidowinc.com/affiliate-program.html I'm having trouble with my form code. Every time I put it up, a message is put in saying "This form is inoperational!" Here is the code I'm using: Code: <form action="MAILTO:felinas_jellicleworld@hotmail.com" method="post" enctype="text/plain"> Name:<br> <input type="text" name="name" size="20"> <p> Email:<br> <input type="text" name="mail" size="20"> <BR> Display:<input type="radio" name="display" value="one" checked="checked"> Do not display:<input type="radio" name="not" value="two"> <br> <p> Country:<br> <input type="text" name="country" size="20"> <br><br> <input type="submit" value="Send"> <input type="reset" value="Reset"> </form> Maybe it's not padding or whatever, but i'm having an issue with my assignment (given the very sketch instructions we get) and I simply can't figure this one out it's making me crazy -.- Look closely at the box with the paragraph, and the logo. Between them is a space of the original background color. I can't seem to figure out why that space is there and how to close the gap. Any ideas? here's the CSS code for the div class/id's around the main content(paragraph and photo) Code: #content { padding-left: 20px;
padding-right: 20px;
margin-left: 150px;
background-color: #F1E8B0;
color: #000000;
padding: 10px 20px;
overflow: auto;
}
#container {
margin-left: auto;
margin-right: auto;
width: 80%;
background-color: #E8D882;
text-color: #000000;
border: 2px double #000000;
min-width: 700px;
}
And here is my xhtml code. HTML Code: <body> <div id="container"> <h1 id="logo"><img src="javalogo.gif" alt="Java Logo" height="117" width="619" /></h1> <div id="nav"><a href="index.html">Home</a> <a href="menu.html">Menu</a> <a href="music.html">Music</a> <a href="jobs.html">Jobs</a></div><br/> <div id="content"> <img src="windingroad.jpg" height="156" width="333" class="floatright" alt="Winding Groad Photo" /> <p>Following the winding road to JavaJam...</p> <ul> <li>Specialty Coffee and Tea</li> <li>Bagels, Muffins, and Organic Snacks</li> <li>Music and Poetry Readings</li> <li>Open Mic Night</li> </ul> <p>12312 Main Street<br/>Mountain Home, CA 93923<br/>1-888-555-5555</p></div> <div id="footer">Copyright © 2011 JavaJam Coffee House<br/><a href="mailto:whatever">SomeSite</a></div> </div> </body> Thanks a lot in advance. Hey guys In internet explorer, in a computer that has Skype installed on it, Skype makes all telephone numbers in webpages into Skype buttons with a Skype menu! Here is an example. http://thebrowserhighlighter.com/images/tool_skype.gif There are two problems with this: As a result, Skype takes control of the graphics, it changes the font, the size, and adds a Skype button near it! The second problem is that Skype also "thinks" IDs and or catalog numbers are PHONE numbers, and does the same thing to them! Is there a way to disable Skype from doing this (not in MY computer, in the HTML itself)? Hello, I am very new to this. Here is the problem, i have a paragraph, then 3 blockquotes, and then another paragraph. But instead of showing the 2nd paragraph under the blockquotes, it is putting it on the side of the blockquotes. This is undesirable. Here is my head and style:. Code: <head>
<style type="text/css">
body
{background-image:url('Seamless_Parchment_by_FantasyStock.jpg');
margin-top:50px;
margin-bottom:50px;
margin-right:100px;
margin-left:100px;}
h1
{color:Black;
text-align:center;
font-family:"Georgia";
font-size:44px;}
p
{font-family:"Trebuchet MS";
font-size:28px;}
a:link
{text-decoration:underline;
color:black;}
a:visited
{text-decoration:underline;
color:black;}
a:hover
{text-decoration:underline overline;
color:red;}
blockquote
{font-family:"Trebuchet MS";
font-size:24px;
float:left;
width:800px;}
</style>
</head>
And here is the html in question: Code: <p> texttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttext </p> <blockquote>texttexttexttexttexttexttexttexttexttexttexttext</blockquote> <blockquote>texttexttexttexttexttexttexttexttexttext</blockquote> <blockquote>texttexttexttexttexttexttexttexttexttexttexttexttextt</blockquote> <p> texttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttext </p> I could just increase the width (tried it - it works) of the blockquotes until the paragraph is forced down, but this seems sloppy to me, and i think it cause problems when other people view it. Any help would be great, Thanks guys! Hello everyone. Great website! I have been trying to fix a problem with my menu in mozilla. Everything seems perfect in internet explorer so does anyone mind having a look and maybe tell me how to fix it. It is the first website i have built apart from a 1 pager once. If i give you the web address, look at it in IE then go through the menu, then do the same with mozilla if you don't mind. In mozilla when you mouse over the menu it covers half the menu and there is a border thingymijig. You'll see when you have a look. The website is for our local football team, and it is nowhere near finished but i would really like this problem sorted. I have been messing about with some pages - the bit at the top to see what makes any difference, i'm meaning the - <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> bit. Which 1 is the best to use? Any help would be greatly appreciated. Thank you! http://www.byronboysclub.com Hello HTMLforums.com community! I am doing some minor web design for an NPO (non-profit organization) in my community. There are some pages that exhibit this strange spacing between the headers and body as you will see on the following pages: http://www.gadshillcenter.org/progra...grams_main.php http://www.gadshillcenter.org/progra...enservices.php http://www.gadshillcenter.org/progra...connection.php This same thing happens with all other program_??.php pages. However, it does not happen on the following, seemingly identical templates: http://gadshillcenter.org/report/report_main.php http://gadshillcenter.org/newsevents...herreading.php http://gadshillcenter.org/newsevents...blications.php There doesn't seem to be borders on any of the pictures, so I see no reason for the indent that pushed the picture and top-left edge down one row. I use Microsoft Office Sharepoint Designer 2007. If you would like to view the code for any pages, just ask! Any ideas why? I could ENTIRELY reformat the pages, put them into tables and what-not, but that would take a while. Is there any way around this? Thank you all! Sincerely, Andrew Hey guys, I have what seems to be a very simple problem but I cannot find the answer. I have a table with two columns. The first contains some text, the second an input box. Both columns are set to 50% and the input box is set to 100%. The input box contains a long piece of text. Under IE 6, FireFox and Opera the two table cells correctly take up 50% each and the input box takes up 100% of it's parent cell. However, under IE 7 - the input box expands to accommodate all of it's text. Does anyone know how I can stop IE 7 from doing this? The only way I have found is to make the table-layout fixed but this seems to have knock on effects. Does anybody know of a better solution? Many thanks, Ben . Here is my example code: <html> <body> <form name="ben"> <table style="width: 75%;" border="1"> <tr> <td style="width: 50%;"> Label: </td> <td style="width: 50%;"> <input type="text" style="width:100%;" value="This is reall long text that in IE 7 very annoyingly causes the table to adjust it's size beyond the set boundaries! Arghhhhh!!!!!!!!!!!!!"/> </td> </tr> </table> </form> </body> </html> In IE7 and 8, the layout of the page is fine but in IE6 it seems to wrap the long table to the end of the page (down). Now, im just looking at the source/code and didnt design the layout but no idea why its doing it. from what I am seeing, when the width of the table with the columns exceeds the width of the page, scrollbars are being added (which is fine) and therefore it shows the entire table right at the bottom fo the page instead of where it should be, in the middle/next to the content on the left handside. not sure what more to add as I cannot publish a link as there is no live site but in development. its using tables, tr's and th's Code: <thead> <tr> <th> Name </th> <th> Address 1 </th> <th> Address 2 </th> <th> Address 3 </th> <th> City </th> <th> County </th> <th> Post code </th> <th> Switchboard </th> <th> Fax </th> <th> Url </th> <th> Business sector </th> <th> Status </th> <th> First name </th> <th> Last name </th> <th> Title </th> <th> Job title </th> <th> Email </th> <th> Direct dial </th> <th> Mobile </th> <th> Mail DPA suppression </th> <th> Date mail DPA suppressed </th> <th> Email DPA suppression </th> <th> Date email DPA suppressed </th> <th> Telephone DPA suppression </th> <th> Date telephone DPA suppressed </th> <th> F10 registration </th> </tr> </thead> when from the firstname heading to the last column heading is removed, the layout is fine.... but when adding them in, thats where the problem happens. any ideas? Hi there I have a layout problem with a news listings page. The listings are database driven and some results pages are fine whereas some others break. I wonder if anyone can help me? http://www.zleeps.co.uk/news.asp?offset=30 Cheers, Kev Having a problem with my layout Here is the link... I can't get the text to stop overflowing out of the div. It only seems to be doing it horizontally. Vertically it is doing fine but i'm trying to get the background image to stretch and it wont do it! Okay, first of all sorry for posting so much, just I keep on running into problems with my layout that I'm making. Hmm, so I'm using the "hover", "active", and "visited" attributes for my layout that I'm creating right? When I click on the link, it turns into the automatic purple after I've visited it(or whatever color it is?). I don't want the automatic purple. I just want to keep it the same color (light blue) that it already is. I tried making it so that its blue after its visited, but what happened was that none of the "hover" tributes were applied. Can someone help me? Link: http://www.freewebs.com/noeylani94/index.htm Hello all! Got this huge problem which kept me up for like 30 hours now. The layout on http://www.easydialer.nu/facelift/index.html couldn't be more different in IE than FF. How in the world can be able to get the layout that is shown in FF, work in IE? Feels like I've tried everything now. Every suggestions, thoughts or help will be warmly appreciated. Thank you! |
|||||||