COBOLdinosaur

I don't have any problem seeing images, but the page does throw an error that the google map can't be displayed either because of an error in the API code, or unauthorized use. The page is so heavily scripted that I am not surprised you have problems with it. plus the stacked div layout leaves a lot of places for a bad line of code to hide. You need to simplify if you want to be able to maintain that page.

The first problem is that you are using display:block for the hover and it should be display:inline. The second problwm is the the width if the sub is getting added to the parent. It has no width until it is hovered. it probably needs to be position:absolute. I have a number of dropdown menu options that are CSS only on my site. You might see the way to do what you are trying to do with one of the examples. I'm not quite sure what your intention is without some description of what you think you are trying to acheive.

This rul is probably the problem: ul { list-style-type:none; margin:0 auto; padding:0; overflow:hidden; ul is a block element and when no width is specified it defaults to width 100%. With width 100% there are no right an left margins. You need to specify the width to get the margins to have an impact.

I agree that it probably is a timing issue though I would prefer the more modern approach of: window.addEventListener('load', init,false); You are getting the error because the script is sometimes firing before the HTML parser has completed creation of the elements and their nodes in the Document Object, so when the elements are referenced they do not yest exist and are therefore null, or undefined.

It was pointed out by two of us that they have incorrect code in the CSS. If they used correct syntax then most of the problem would have been solved and perhaps some tweaking would have been necessary instead they go to a "solution" that is non standard inefficient, and a maintenance problem in waiting. If that kind of ugly hack was necessary then fine do it; but when a path to a correct solution is offered that is what should be used. If they were one of my students, I would consider I had failed them if they considered such a solution, and there is othing more I can offer.

If it is encrypted, how is the browser supposed to parse it an interpret it? The browser would need to have the encryption key and if that is the case, then it is available to the user. If you think your source code is so unique and special (I guarantee you it is not) then you should not be puttinging it on a web page because no matter what you do it has to be readable for the browser, and that means it will be no challenge to anyone who wants to read. The only way to be certain no one can see your code is to lock it in a metal box weld the box closed and bury it at the drop it in the deepest part of the ocean. If the code if for an app then you should be writing it in an application language like c and then comiling it. that will at least make it a little mor difficult to de-compile; but on a web page there are no secrets.

Unbelievable. Using jquery to hack it with inline styling and obsolete font tag and attributes, instead of taking the time to write the CSS correctly. I need to move on to something else before I puke.

The correct syntax is to bottom, not top. The top works in Chrome and Opera because the early incorrect experimental implementation in webkit assumed a different syntax than what was eventually adopted by W3C. Firefox and IE and current versions of Chrome do not need the hyphen hack because they all now comply with the W3C standard. Older version of Chrome still need the hyphen hack. I'm not sure about Safari and Opera. They are still using webkit and I don't know if webkit has been patched to do it right yet. Chrome now uses the blink fork of webkit which implements the standards compliant version.

Local storage is less efficient, and still has the problem that the user has to enable it. Plus it is a real klug to work with.

I don't see anything affecting opacity, so I would suggest that the image itself my be the source of the transparency. I which case there is not you can do in HTML or CSS to adjsut that, you will need to fix the image in a graphics program.

If you want to have variable visited values based on anything other than browser history you will need to use cookies;and the best you can hope for is that it will be semi-reliable.

If the sizing is critical then you should use a reset stylesheet to override the user user agent stylesheets because each browser has its own setting. so you just load your own rules for what you consider critical and override the browser settings. You can find any number of reset strategies and reset stylesheets by Googling CSS Reset

Just give the content a height using calc and vh: height:calc(100vh - 150px); Some older version of Chrome still choke on the vh in a calc so you might need to use a percentage instead: height:calc(100% - 150px); more about calc and vh on my site BTW it is really bad practice to put styling linline like that. It will create all sorts of maintenance problems for you.

If you actually need that button instead of just styling the link to look like a button an you want to inject text into it then put the link and a span containing the text inside a common wrapper with position relative, an give the link and span position:absolute;top:0;left;zero; I don't know what "book" you are referring to, but the code as written is not going to do anything but display the buttin as an image link.

We can't trouble-shoot what we can't see. Post a link, or at least the code please.

The first thing you need to do is use valid code. what you have there ids full of errors primarily caused by the missing doctype which cause the validator and the browsers to use an HTML transitional doctype which is virtually obsolete and does not support many of the tags you are using. Then you go to the reference area of this site for information about the use of CSS multi-column properties: http://www.w3schools.com/css/css3_multiple_columns.asp One other thing. CSS belongs in external files not coded directly in the page.

You might want to re-think doing it that way. Putting your email address on a web page is a guarantee that that email address will end up an unusable mess full of spam. You would be better to do a contact form that simple capture the entered information into a file or database; or generates the email on the server side without exposing your email address.

you could try giving the dd and dt a style property of display:inline-block; though you might then need a <br /> to break the lines. If you are using a table, you could simulat that without the table by styling them with display: table-cell

If you just want to use the borders then you can do: #diamond { width: 0; height: 0; border: 50px solid transparent; border-bottom-color: red; position: relative; top: -50px; } #diamond:after { content: ''; position: absolute; left: -50px; top: 50px; width: 0; height: 0; border: 50px solid transparent; border-top-color: red; } There are a lot more shape options incase you want to explore additional shapes for most elements on my personal site. Personally I prefer buttons with rounded sides, but I guess diamonsa are okay. With shaped bordersyou need to be careful about getting the padding right.

That simple diamond effect does not need an image if you use CSS to create a square then just use transform:rotate(45deg) to turn it into a diamond. Of course that will also rotate the text, so you might want to position the text, or put the text in a span and rotate it 315 degrees to bring it back up to alignment. I have a bunch of stuff using rotate for effects on my personal site or if you want to play with shapes you will find several pieces about those as well.

There are an unlimited number of interactions on a page involving markup, styling and script; a fragment of code without context is probably not going to be much help in finding a solution. A link to the page or more complete code would make it possible to do diagostics.

If the image is i a link to the profile then the profile will be loaded. If that does not answer your question then it is probably because I am guessing what you are trying to do because you are not providig enough information.

The round frame is not difficult just a little CSS property border-radius:50% will fully round the element. To get a circle the height and width must be the same if the image is a rectangle yo end up with a more oval shape. As for the margin, I quit trying to make Wordpress behave a long time ago. WP imposes a lot of restrictions and I avoid getting involved in the hours it takes to do a ten second margin change.

Using a transitional doctype means the page is getting rendered by FF and IE in quirksmode. You need to use eith a strict doctype or modernize. HTML5. I'm not sure you will get correct rendering of elements using calc() in quirks mode. Even without quirks mode IE is still a little buggie but may work okay if you avoid using vh. If all else fails you might be able to force it by using min-height:100% or min-height:100vh. However in quirksmode you never really know what will work until you try it.

If you are struggling at this level, I would suggest that you might benefit from investing a little bit of time going through some of the tutorials and reference materials here at w3schools. You don't have to remember everything, but if you know where to look for information it will save you a lot of frstration as you advance you development skills.