...

View Full Version : Best Way To 600x800 Friendly My Site



mlg5454
05-11-2008, 08:33 PM
www.theartshole.com

or should i just leave it as is?

_Aerospace_Eng_
05-11-2008, 10:37 PM
Most your site can already fit a 800x600 resolution. I suggest you resize your splash page image to something like 780px. Center it as well.
Simply changing your #container CSS (make sure you get rid of the duplicate one) to this

#container {
width:80%;
margin:auto;
text-align: center;
min-width:700px;
}
Will allow you to accommodate for those users.

mlg5454
05-13-2008, 04:11 AM
definitely doesn't really do anything for most of my site... i get the idea of what it should be doing though. what do you suggest i do once i get past the splash page?

_Aerospace_Eng_
05-13-2008, 04:14 AM
Right because you didn't follow directions. You have this

#container {
width:80%;
height: 800px;
position: absolute;
top: 0px;
left: 0px;
min-width:700px;
}
When it should be this

#container {
width:80%;
min-width:700px;
margin:auto;
}

mlg5454
05-13-2008, 04:21 AM
thanks for the quick reply my friend!

well, i did that now and my problem still remains, which i guess is that my UL is absolutely positioned. but i can't figure out how it should be positioned otherwise, and also that footer down there is still really low in the window. i'm sorry i'm so amateurish but that's why i'm here on these forums!! :D

_Aerospace_Eng_
05-13-2008, 05:32 AM
Be sure to update the CSS in all places on your site where you use #container. Try this

#container {
width:80%;
margin:auto;
position:relative;
min-width:700px;
}
the footer is at the bottom because of your menu. Don't know if you would want your footer to be overlapped by your menu.

mlg5454
05-13-2008, 05:48 AM
awesome! thank you.

probably my last question on this:

why is my scrollbar telling me the page is so high? i tried tweaking around with min-height on the container and that certainly didn't help...

_Aerospace_Eng_
05-13-2008, 06:05 AM
Make the changes on the stuff page and get rid of the height on the #content part.

mlg5454
05-13-2008, 06:16 AM
make which changes to the stuff page.. ? i can't find any more arbitrary height designations in my code for that page... the other ones, yeah the content div is now stripped and everything's fine but uh... egh.

mlg5454
05-13-2008, 06:25 AM
ooh!! also, getting rid of height on this page:

http://www.theartshole.com/art/assorted.html

screws something up, working on that one...

_Aerospace_Eng_
05-13-2008, 06:32 AM
You need to clear your floats.
http://positioniseverything.net/easyclearing.html

mlg5454
05-13-2008, 06:41 AM
will have to brew some tea then read that bit! i'm not good on the technical aspects. at least when this tired.

but that stuff page... what exactly is making my height value so massive ! there's no #content div, only a #nav div which is set to 100px height... it's really mind boggling to me

FWDrew
05-13-2008, 07:18 AM
will have to brew some tea then read that bit! i'm not good on the technical aspects. at least when this tired.

but that stuff page... what exactly is making my height value so massive ! there's no #content div, only a #nav div which is set to 100px height... it's really mind boggling to me

Not much to it to fix your footer problem, like aerospace said, clear your floats. Add this above your footer div in the html :thumbsup:



....
<br style="clear:left;" />
<div id="footer">
.....


Drew

mlg5454
05-13-2008, 07:26 AM
AWESOME.

now, is the reason why the height is so extreme on my stuff page just so apparent you guys are waiting for me to figure it out? :P that has happened to me several times actually so ...

FWDrew
05-13-2008, 07:29 AM
AWESOME.

now, is the reason why the height is so extreme on my stuff page just so apparent you guys are waiting for me to figure it out? :P that has happened to me several times actually so ...

Love the sarcasm :rolleyes: If I knew the answer to your height problem I would have said it.

Drew

mlg5454
05-13-2008, 07:31 AM
no no! i'm sorry i'm not being sarcastic, interwebz bad for semantics...

FWDrew
05-13-2008, 08:47 AM
no no! i'm sorry i'm not being sarcastic, interwebz bad for semantics...

Then I apologize if my previous post sounded rude, I thought you were being sarcastic.

Unfortunately, I am not sure how to fix your height issue, I am sure someone else will be able to. :)

Drew

mlg5454
05-13-2008, 09:52 AM
i have 2 other forums looking at it for me so i'll let you guys know if you'd like to gain the knowledge!! unless of course somebody here figures it out first!
max

_Aerospace_Eng_
05-13-2008, 03:46 PM
Its how you positioned your li elements. You made them position:relative; and then used top and left to position them but what you didn't know is that the original space they were in is still occupied. Try this for your navigation CSS and footer div

#nav {
margin: auto;
margin-top: 30&#37;;
height: 100px;
width: 720px;
text-align: center;
}

ul {
list-style: none;
display: inline;
text-align: left;
}

li {
margin: 0;
padding: 0;
float:left;
}

li.artists {
height: 95px;
width: 90px;
position: relative;
overflow: hidden;

}

li.history {
height: 95px;
width: 90px;
position: relative;
overflow: hidden;
}

li.art {
height: 95px;
width: 90px;
position: relative;
overflow: hidden;
}

li.releases {
height: 95px;
width: 90px;
position: relative;
overflow: hidden;
}

li.shows {
height: 105px;
width: 90px;
position: relative;
overflow: hidden;
}

li.videos {
height: 105px;
width: 90px;
position: relative;
overflow: hidden;
}

li.listen {
height: 105px;
width: 90px;
position: relative;
overflow: hidden;
}

li.read {
height: 100px;
width: 90px;
position: relative;
overflow: hidden;
}

#artistspic {
position: absolute;
}

#historypic {
position: absolute;
top: -270px;
}

#artpic {
position: absolute;
top: -140px;
}

#releasespic {
position: absolute;
top: -290px;
}

#showspic {
position: absolute;
top: -78px;
}

#videospic {
position: absolute;
top: -280px;
}

#listenpic {
position: absolute;
top: -1px;
}

#readpic {
position: absolute;
top: -88px;
}

#footer {
margin: auto;
margin-top: 320px;
padding: 0;
height: 50px;
text-align: center;
border-top: 1px dashed #ccc;
clear:both;
}

mlg5454
05-18-2008, 08:00 AM
whoa.

awesome.

thanks.

how does that float trick work? i don't get it. (but will use the trick from now on)

FWDrew
05-18-2008, 10:01 AM
how does that float trick work? i don't get it. (but will use the trick from now on)

The float property sets where an image or a text will appear in another element.
http://w3schools.com/css/pr_class_float.asp
^^Explains it a lot better than I can in words. Just a heads up, when using floats be sure to clear them properly or you will run into some issues, here is a good read:
http://www.positioniseverything.net/easyclearing.html

Hope that is of some help :)

Regards,

Drew

effpeetee
05-18-2008, 11:05 AM
Check here.

http://www.exitfegs.co.uk/Floats.html

Frank.

The other urls are useful too.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum