/    Sign up×
Community /Pin to ProfileBookmark

first-of-type selector question

Copy linkTweet thisAlerts:
May 08.2014

I wrote some code for responsive navigation based on an on-line tutorial. Unfortunately, because of my double line navigation text I am having a problem when viewed on a screen size less than 800 pixels wide.

One of the navigation button words was being placed over the top of my “Menu” word. I solved the problem by using a “first-of-type” selector. This pushed the navigation items down so they did not overlap the word Menu.

However, now after you click on the Menu button, the whole navigation is pushed down 50 pixels once the navigation window has slid down.

Is there a way to push the navigation down before the navigation window slides down, yet not have it pushed down when the navigation window is open?

The next problem with this fix is I see “first-of-type” doesn’t work in IE8. If there a fix for this problem?

You can see the website here: [URL=”http://www.lawrence-nv.us/Rnav/”]http://www.lawrence-nv.us/Rnav/[/URL]

to post a comment
CSS

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@ShrineDesignsMay 08.2014 — You can usenav ul li[B]:first-child[/B] {
/* ... */
}The situation doesn't really require the need to use [I]first-of-type[/I].
Copy linkTweet thisAlerts:
@lkeeneyauthorMay 08.2014 — You can usenav ul li[B]:first-child[/B] {
/* ... */
}The situation doesn't really require the need to use [I]first-of-type[/I].[/QUOTE]

Thank you for the tip. I assume first-child works in IE8.

On a side note, I hate having to constantly be concerned about things not working in IE.
Copy linkTweet thisAlerts:
@ShrineDesignsMay 08.2014 — Worse let was the days when we used to have to work around the abominations IE 5/6/7.

I honestly disregard anything IE that is older than 9. Granted IE has improved much since the days of IE 6/7. But it is still breaks (i.e. can set font-size for <sub> and <sup>).

When IE makes you mad, just look at this chart, it'll put a smile on your face. ?
Copy linkTweet thisAlerts:
@lkeeneyauthorMay 08.2014 — Worse let was the days when we used to have to work around the abominations IE 5/6/7.

I honestly disregard anything IE that is older than 9. Granted IE has improved much since the days of IE 6/7. But it is still breaks (i.e. can set font-size for <sub> and <sup>).

When IE makes you mad, just look at this chart, it'll put a smile on your face. ?[/QUOTE]

Thanks for the chart. You made my day with this one. ?

I am also getting frustrated working with Firefox, which I have used for many years. Maybe I will join the others in switching to Chrome.
Copy linkTweet thisAlerts:
@ShrineDesignsMay 08.2014 — I've used Firefox since the beta (back when it was call Firebird). Firefox is good, has by far the best JavaScript engine. Chrome is good, built-in sand-boxing and the like, making security better over the rest. Both in my opinion are at the top in terms of web browsers.

The new version of Firefox looks too much like Chrome.
×

Success!

Help @lkeeney 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 4.23,
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: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...