I'm trying to line up a left hand label with a right hand list. It seems like under the hood the HBox
and VBox
are using flexbox but i can't get them to nest and align correctly. The doc examples only show simple horizontal alignment, which isn't going to well for me either. Anyone done this before?
The image below is what I'm shooting for:
This is what I'm getting:
Here is the code:
from ipywidgets import *
t = {
"Product List": [
"tblProducts",
"AMZ Listing Fees",
"tblReferalFee",
"tblSellingFees",
"tblRentalBookFee",
"tblHighVolumeFee"
"tblRefundAdministrationFee"
], "AMZ FBA Fees": [
"tblFullfillment_Fees",
"tblMonthlyStorageFees",
"tblLongTermStorageFees",
"tblRemoval_Fees",
"tblReturnsProcessingFee",
"tblInventorySizes",
"tblInventoryPlacementFees",
"tblCasePackedProduct",
"_tblDim_Const"
], "Enums": [
"_Product_Enum_UnitType",
"_tblMediaCatagoriesEnum"
]
}
dispBoxes = []
for k,v in t.items():
vlayout = Layout(
flex="5 5 auto",
width="auto",
halign="center"
)
hlayout = Layout(
flex="1 1 auto",
width="auto"
#halign="center"
)
tblLbs = [Label(i) for i in v]
dispBoxes.append(
HBox([
VBox([Label(k)], Layout=vlayout),
VBox(tblLbs, Layout=hlayout)
]))
display(
VBox(dispBoxes)
)