/    Sign up×
Community /Pin to ProfileBookmark

CSS HELP!! Some pages working, some not..

Hello,

I am working on a site here:

[url]http://tinyurl.com/lj2gbm[/url]

and I just put up the “Slideshow JS” for the pics in the top banner…

I had to play around with the CSS to get everything to align right on the HOME page…

But, if you click on some of the other links (i.e. The Students, or Information) all the text shoot down to the bottom and there is a HUGE gap in between the top banner and the text…

HELP!!! Any suggestions? Thanks! Also, I am using J00mla (latest version)

to post a comment
CSS

7 Comments(s)

Copy linkTweet thisAlerts:
@shirestudiosauthorSep 02.2009 — Please help!!
Copy linkTweet thisAlerts:
@WebJoelSep 02.2009 — Some errors on the code: Two "<title>" in "<head>", an un-opened closures "</ul>" and some other potentially problematic things. I have not seen yet quite what you're describing though...
Copy linkTweet thisAlerts:
@CFHuttonSep 02.2009 — I think it's an ie problem. There does appear to be some issues in ie6 with the 'The Students' page. I don't have ie7 on this computer. Looks ok in firefox.

I'd validate the page and fix the errors and then see what it looks like...

CFH


Some errors on the code: Two "<title>" in "<head>", an un-opened closures "</ul>" and some other potentially problematic things. I have not seen yet quite what you're describing though...[/QUOTE]
Copy linkTweet thisAlerts:
@shirestudiosauthorSep 03.2009 — Thanks, I'll give this a try...I noticed it is screwed in IE7!

I LOVE Firefox!!! *sigh*
Copy linkTweet thisAlerts:
@SeanieCSep 03.2009 — Hi,

From my understanding you're trying to position the fading images in the center of the screen?

If so, the best method of doing this is...

1) remove both the float:right; and position:absolute; from #main

2) give #main a width of the images i.e. 800px

3) give #main margin:auto;

This will position #main central to its parent, which is currently #sidebar, you may want to move it to #content within your html.

[code=html]
<div id="content">
<div id="sidebar">
...
</div>
<div id="main">
images go here
</div>
</div>
[/code]


Also you have margin:left; (invalid) for #content, you should remove this and the width:1020px;, this will allow #content to stretch the whole way across the view port (good for all resolutions).

Let me know if that helps,
Copy linkTweet thisAlerts:
@shirestudiosauthorSep 06.2009 — Thanks, but I couldn't get it to work...

the only problem I think I am having now is that in Internet Explorer, the slideshow banner positions itself in the center....offset from the text (see firefox for the correct view).

Thanks again!
Copy linkTweet thisAlerts:
@CFHuttonSep 06.2009 — When I use firebug to look at your page, you have a #main div with some odd rules. It appears to be floated right, but then you use position:absolute which I think negates the float (and the top margin).

That div stretches the width of the logo and about 3/4s of the area under the rotating images.

Something is wrong there.

CFH
×

Success!

Help @shirestudios spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...