Comments (5)
Hey -
So your issue is that your markup isn't tied together completely. Skeleton doesn't assume that the order of your tabs is the order of your content (for a number of reasons). You are missing a needed href
in your a
and a matching id
for your .tabs-content li
.
<ul class="tabs">
<li> <a class="active" href="#one">Watchers</a></li>
<li><a href="#two">Forks</a></li>
<li><a href="#three">Creation</a></li>
</ul>
<ul class="tabs-content">
<li id="oneTab" class="active">About Watchers</li>
<li id="twoTab">About Forks</li>
<li id="threeTab">About Creations</li>
</ul>'
You also didn't close your li
's in your .tabs-content
.
Hope that helps out and addresses your issue!
from skeleton.
... what if my content ( in "tabs-content" ) is not inside the same document but dynamically generated ?
Like the following for example :
`
`... could that works like following ?
`
- Watchers is dynamic content ( api )
- Forks is dynamic content ( api )
- Creations is dynamic content ( api )
from skeleton.
From the HTML4 specs:
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").
I'd imagine that you can have slashes in element IDs, but expect odd behavior between different browsers, given that the specs do not explicitly state that it is an allowed character. I personally wouldn't suggest it.
from skeleton.
... than how can I tab, if possible, a dynamic content ? I mean an ancor which is not inline # ancor but a relative path like ' / ' which is root slash in my site : http://mysite.com/ ), or also /forks for the http://mysite.com/forks ?
from skeleton.
Get it via AJAX then insert it into the tab-content LI.
from skeleton.
Related Issues (20)
- off-line
- Disable responsice layout for Skeleton V1.1 HOT 3
- Update to Current Features HOT 4
- Error 'Bug', The input is not aligned vertically, it can not be in the center, middle
- Recommended Fork With IE9/10 Support ?
- I know nothing about coding : Google ding me for slow loading speed on HOT 1
- How do I make the buttons smaller? HOT 1
- How to gutter size between columns while adjusting column width?
- from Skeleton to Skelet. HOT 2
- Code block size inconsistent for long lines with horizontal scrolling HOT 4
- Need Help with Rows and columns HOT 3
- Nevermind for this issue, you can delete HOT 4
- SSL cert for getskeleton.com HOT 2
- Page no longer horizontally centred HOT 1
- textarea can't set attributes rows
- Why have the button a fixed height?
- Secure
- Hgd
- Updating Examples on Site
- Grid
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from skeleton.