Hey, so I'm having a problem with a webpage I'm writing, and I was hoping somebody here might be able to help me. Some background first: I have this very minimalistic webpage, with a simple navigation bar at the top, and eat menu item appears to glow once you select it. I want the transition to be seemless from each menu item to another. Now, I have the entire content of the page in a big div, and I have that div set to to auto margins (with a fixed width), so that, as you resize the browser, the bulk of the page stays in the center. This works great on all my pages except for one. One of them is my resume, and it's a bunch of text with one image and a list, and various different styles. For some reason this page is shifted slightly to the left from all the other pages, but only when the browser is resized to a width greater than the width of the page. When it's the same width or smaller than the page, it looks fine. This is pretty annoying. I can fix this issue by setting the body to shift slightly, but then that causes the smaller widths to be shifted as well. I have narrowed down the cause to one of two things: either the list is causing the issue, for reasons I don't understand, or it has something to do with text that goes on past one line and continues on the next. I think it's probably more to do with the latter, but one odd thing I've noticed is that the problem persists even after I've inserted a break so that the text doesn't wrap to the next line. I'm really confused about all this. Can anyone help?
I don't have an actual site yet. It's just sitting on my computer. The only thing I can really share is the external CSS file: img.slash {position:relative; left:-30px} .current {text-shadow: 0px 0px 3px #999999; color: #0000FF} .total {margin-left:auto; margin-right:auto; width:930px; font-family:Verdana, Geneva, sans-serif; font-size:100%; bottom:100px;} body {margin-left:40px} img {vertical-align:middle} a {text-decoration:none; color:black} a:hover {text-decoration:none; color:#00CCFF}
If you want it to resize, why don't you just use a responsive grid? Here are a few links both explaining and giving examples: http://learn.shayhowe.com/advanced-html-css/responsive-web-design http://www.responsivegridsystem.com/ http://responsablecss.com/
Oh well, sorry. I can't really show you the page because it has a lot of personal information on it that I don't want to share here on ASSEMblergames. I could remove some elements, but it probably wouldn't be very useful for debugging purposes at that point.
https://www.dropbox.com/s/vj9vt9xl58z58xa/export.zip Here's a small section of my page. The only active menu items are Resume and Photography. Obviously a lot was removed. You will notice that when you switch between the two, the margins change. The position of the content in "photos.html" is the way the page is supposed to look. "resume.html" is offset slightly.
Surely if its information you dont want us to have, its not something you should be putting on a website? It will get found eventually...
It's complicated. Just look at the files I posted. Nothing I removed had any effect on the problem I mentioned before.
My post isnt about the formatting, just more of "if its on the internet, its public anyway" - more so that you are aware of it.
Yes, I'm aware of that. It's not an issue. It really just comes down to a personal preference, which I don't feel the need to explain.
Awesome, that works perfectly! I can see what it does now, but I never would've figured that out on my own. Thank you.
