webForumDet fria alternativet

Listor bredvid varandra

10 svar · 772 visningar · startad av Web-Tor

Web-TorMedlem sedan nov. 200013 890 inlägg
#1

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.

jarvkloMedlem sedan juli 20013 378 inlägg
#2

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? ;)

OkkidoMedlem sedan maj 20007 492 inlägg
#3

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?

Web-TorMedlem sedan nov. 200013 890 inlägg
#4

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.

SaschMedlem sedan nov. 2002830 inlägg
#5

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>
Web-TorMedlem sedan nov. 200013 890 inlägg
#6

Ä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.

SaschMedlem sedan nov. 2002830 inlägg
#7

Kolla posten innan ditt svar :)

Web-TorMedlem sedan nov. 200013 890 inlägg
#8

Tack för ditt svar, men jag kan inte se att din kod löser något av mina problem. :q

SaschMedlem sedan nov. 2002830 inlägg
#9

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 ;)

Web-TorMedlem sedan nov. 200013 890 inlägg
#10

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

FuelMedlem sedan okt. 20001 285 inlägg
#11

...

129 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
125 ms — hämta tråd, inlägg och bilagor (db)