10 svar · 774 visningar · startad av Web-Tor
Jag arbetar med att bygga om vissa delar av en sida men har stött på ett problem i det här kraftigt förenklade exemplet.
1. Om man förminskar fönstret så hamnar de två info-texterna under varandra vilket är bra men jag vill att tabbarna ska ligga kvar i nederkant.
2. Hur mycket man än förminskar fönstret ska inte info-texterna kunna hamn under tabbarna.
Det räcker med att det funkar i IE.
Hmm....
Jag vet att det här förslaget kanske känns lite gammalmodigt, men om du ändå behöver klämma in hela klabbet i en tabell, kan du väl bygga flikarna och info-texten med en egen nästlad tabell istället för en "float-float-clear"-lösning inuti en tabellcell som du har i exemplet? ;)
Om det är okej att ändra strukturen i html:en så borde det väl funka att lägga info innan tabs. Sen float right på info och float left på tabs?
Jo, jag är inte helt nöjd med blandningen av tabeller och divar men det är tyvärr inte jag som byggt systemet från början… Jag skulle gärna vilja ha alla navigering i listor.
Lägger jag float:right så blir ju infon högerjusterad och jag vill gärna ha den bredvid tabbarna men så att dom inte kan hamna under.
I cellen där navigeringen ligger är det i princip okey att flytta om koden hur som helst.
För att listnavigeringen inte ska lägga sig över varandra måste dessa ligga i en div som har en fast bredd alternativt att du ger din ul en fast bredd.
//R; Läste inte ordentligt:
#body {
text-align:center;
}
#content [
margin: 0 auto;
text-align: left;
width: 50%;
}
#primary-content {
width: 100%;
}
#tabs, #info, #primary-content {
float: left;
}
<div id="container">
<div id="content">
<div id="tabs"><ul><li></li></ul></div>
<div id="info"></div>
<div id="primary-content"></div>
</div>
</div>
Är du säker? Någon fast bredd kan jag inte lägga in eftersom innehållet på sidan kan variera beroende på språkval, rättigheter m.m.
Kolla posten innan ditt svar :)
Tack för ditt svar, men jag kan inte se att din kod löser något av mina problem. :q
Om du har strukturen kommer allt inom container-diven dels alltid ligga i mitten, kommer floata som de ska samt att de kommer separera tabeller och topnavigering (och infon).
Sätter du "white-space: nowrap;" på content-divven så kommer du nog få problemet löst ;)
Detta verkar inte gå att lösa med listor och CSS så då får det väl bli en ful tabellösning i alla fall. :l
...
