diff --git a/packages/blitz-dom/src/accessibility.rs b/packages/blitz-dom/src/accessibility.rs
index cbd5aefc..9b0421c5 100644
--- a/packages/blitz-dom/src/accessibility.rs
+++ b/packages/blitz-dom/src/accessibility.rs
@@ -136,6 +136,33 @@ impl BaseDocument {
             };
 
             builder.set_role(role);
+
+            /*
+             * A select and its options carried their roles and nothing else, so
+             * the tree said "there is a combo box here" and stopped. What it
+             * offers, what is chosen, and which option that is were all absent,
+             * which is exactly the set of questions a QA harness asks of a
+             * picker before it can drive one.
+             *
+             * The options are already in the tree: the traversal walks raw
+             * children, so `option { display: none }` does not hide them. Only
+             * the state was missing.
+             */
+            match &*name {
+                "select" => {
+                    builder.set_value(self.select_label(node.id));
+                }
+                "option" => {
+                    // An explicit label, rather than relying on the text child
+                    // labelling its parent: an option's text is `display: none`
+                    // and a consumer that resolves names through the child text
+                    // runs would be reading a node that never gets laid out.
+                    builder.set_label(self.option_label(node.id));
+                    builder.set_selected(self.option_is_selected(node.id));
+                }
+                _ => {}
+            }
+
             builder.set_html_tag(name);
         } else if node.is_text_node() {
             builder.set_role(Role::TextRun);
diff --git a/packages/blitz-dom/src/document.rs b/packages/blitz-dom/src/document.rs
index 13d26253..37208a89 100644
--- a/packages/blitz-dom/src/document.rs
+++ b/packages/blitz-dom/src/document.rs
@@ -255,6 +255,41 @@ pub struct BaseDocument {
     /// paints beneath every background between them and disappears.
     pub(crate) hoisted_fixed_parents: HashMap<NodeId, NodeId>,
 
+    /// Every `position: fixed` node whose containing block is the viewport,
+    /// which is every one of them except those under a transformed ancestor.
+    ///
+    /// Collected by the walk that hoists them, and used by
+    /// `resolve_fixed_positions` to hold them still while the page scrolls.
+    pub(crate) fixed_nodes: Vec<NodeId>,
+
+    /// The viewport scroll currently baked into those nodes' locations.
+    ///
+    /// One value for the whole document rather than one per node: the pin is
+    /// the same displacement for every fixed box, because they all share the
+    /// viewport as their containing block. Reset by `resolve_layout`, which
+    /// rewrites the locations it was added to.
+    pub(crate) fixed_scroll_offset: crate::Point<f64>,
+
+    /// Every `position: sticky` node in the document, in tree order.
+    ///
+    /// Collected by the same walk that hoists fixed nodes, because both need
+    /// one pre-order pass over the box tree and a second one would cost the
+    /// same on every frame of every document, sticky or not. Tree order matters:
+    /// a sticky box inside another sticky box is adjusted on top of its
+    /// ancestor's adjustment, so the ancestor has to be settled first.
+    pub(crate) sticky_nodes: Vec<NodeId>,
+
+    /// For each sticky node, the offset currently baked into its
+    /// `final_layout().location`.
+    ///
+    /// The adjustment is written into the box itself so that paint, hit testing
+    /// and `absolute_position` cannot disagree about where the box is. That
+    /// makes the pass non-idempotent unless it can recover the flow position it
+    /// started from, which is what this records. Cleared by `resolve_layout`,
+    /// which rewrites every location from taffy and so discards the offsets
+    /// along with them.
+    pub(crate) sticky_offsets: HashMap<NodeId, taffy::Point<f32>>,
+
     /// Stacking contexts holding a hoisted child that an ancestor clips.
     ///
     /// Collected while flushing styles so that `resolve_hoisted_clips` visits
@@ -529,6 +564,10 @@ impl BaseDocument {
 
         let mut doc = Self {
             hoisted_fixed_parents: HashMap::new(),
+            fixed_nodes: Vec::new(),
+            fixed_scroll_offset: crate::Point::ZERO,
+            sticky_nodes: Vec::new(),
+            sticky_offsets: HashMap::new(),
             hoisted_clip_hosts: Vec::new(),
             id,
             tx,
@@ -2589,7 +2628,27 @@ impl BaseDocument {
     /// Scroll a node by given x and y
     /// Will bubble scrolling up to parent node once it can no longer scroll further
     /// If we're already at the root node, bubbles scrolling up to the viewport
+    ///
+    /// A `position: sticky` box is held against the edge of the scrollport it
+    /// lives in, so the boxes have to be re-adjusted here rather than only in
+    /// `resolve`: a wheel event does not necessarily produce a style and layout
+    /// pass, and a header that only unstuck on the next restyle is a header
+    /// that visibly lags the scroll.
     pub fn scroll_node_by_has_changed<F: FnMut(DomEvent)>(
+        &mut self,
+        node_id: NodeId,
+        x: f64,
+        y: f64,
+        dispatch_event: F,
+    ) -> bool {
+        let has_changed = self.scroll_node_by_inner(node_id, x, y, dispatch_event);
+        if has_changed {
+            self.resolve_sticky_positions();
+        }
+        has_changed
+    }
+
+    fn scroll_node_by_inner<F: FnMut(DomEvent)>(
         &mut self,
         node_id: NodeId,
         x: f64,
@@ -2653,7 +2712,7 @@ impl BaseDocument {
 
             if bubble_x != 0.0 || bubble_y != 0.0 {
                 let bubbled = if let Some(parent) = parent {
-                    self.scroll_node_by_has_changed(parent, bubble_x, bubble_y, dispatch_event)
+                    self.scroll_node_by_inner(parent, bubble_x, bubble_y, dispatch_event)
                 } else {
                     self.scroll_viewport_by_has_changed(bubble_x, bubble_y)
                 };
@@ -2743,7 +2802,7 @@ impl BaseDocument {
 
         if bubble_x != 0.0 || bubble_y != 0.0 {
             if let Some(parent) = parent {
-                return self.scroll_node_by_has_changed(parent, bubble_x, bubble_y, dispatch_event)
+                return self.scroll_node_by_inner(parent, bubble_x, bubble_y, dispatch_event)
                     | has_changed;
             } else {
                 return self.scroll_viewport_by_has_changed(bubble_x, bubble_y) | has_changed;
@@ -2783,7 +2842,16 @@ impl BaseDocument {
         self.viewport_scroll.y =
             f64::max(0.0, f64::min(new_scroll.1, content_height - window_height));
 
-        self.viewport_scroll != initial
+        let has_changed = self.viewport_scroll != initial;
+        if has_changed {
+            // The viewport is the scrollport a page-level sticky box is held
+            // against, and the containing block a fixed box is pinned to, so
+            // both move with this and not with the next relayout. See
+            // `resolve_sticky_positions` and `resolve_fixed_positions`.
+            self.resolve_sticky_positions();
+            self.resolve_fixed_positions();
+        }
+        has_changed
     }
 
     pub fn scroll_by(
diff --git a/packages/blitz-dom/src/events/keyboard.rs b/packages/blitz-dom/src/events/keyboard.rs
index fd6dae68..f1bdcda0 100644
--- a/packages/blitz-dom/src/events/keyboard.rs
+++ b/packages/blitz-dom/src/events/keyboard.rs
@@ -86,6 +86,25 @@ pub(crate) fn handle_key_or_input_event<F: FnMut(DomEvent)>(
             return;
         }
 
+        // A focussed select owns the arrows, Home and End: they move the
+        // selection. Checked before the mutable borrow below, because deciding
+        // where a select's selection goes means reading its options, which are
+        // other nodes.
+        //
+        // There was no keyboard activation for anything but a text input, so a
+        // picker could be focussed and then not driven at all. A harness has no
+        // other way in: worktables.dev's schema designer selects its column
+        // type by keyboard or not at all.
+        if doc
+            .get_node(node_id)
+            .is_some_and(|node| node.data.is_element_with_tag_name(&local_name!("select")))
+        {
+            if let KeyboardOrTextInputEvent::KeyPress(key_event) = &event {
+                handle_select_keypress(doc, node_id, key_event, dispatch_event);
+            }
+            return;
+        }
+
         let node = &mut doc.nodes[node_id];
         let Some(element_data) = node.element_data_mut() else {
             return;
@@ -116,6 +135,49 @@ pub(crate) fn handle_key_or_input_event<F: FnMut(DomEvent)>(
     }
 }
 
+/// Move a focussed select's selection with the arrows, Home and End.
+///
+/// A select commits immediately, the way a checkbox does and unlike a text
+/// control: the keystroke *is* the commit, so `input` fires here and
+/// blitz-script synthesises the `change` that follows it. Waiting for blur, as
+/// a text field does, would leave a picker that never reports what was chosen.
+fn handle_select_keypress<F: FnMut(DomEvent)>(
+    doc: &mut BaseDocument,
+    node_id: NodeId,
+    event: &BlitzKeyEvent,
+    mut dispatch_event: F,
+) {
+    if !event.state.is_pressed() {
+        return;
+    }
+
+    let target_index = match &event.key {
+        Key::ArrowDown => doc.select_index_step(node_id, true),
+        Key::ArrowUp => doc.select_index_step(node_id, false),
+        Key::Home => doc.select_index_edge(node_id, false),
+        Key::End => doc.select_index_edge(node_id, true),
+        _ => return,
+    };
+    let Some(index) = target_index else {
+        // Already at the end of the list, or nothing selectable. Silently
+        // doing nothing is right: a browser does not wrap around.
+        return;
+    };
+
+    if !doc.set_select_selected_index(node_id, index) {
+        return;
+    }
+    // The selectedness is what `:checked` and the accessibility tree read, so
+    // the restyle has to be asked for or the change is invisible.
+    doc.snapshot_node(node_id);
+
+    let value = doc.select_value(node_id);
+    dispatch_event(DomEvent::new(
+        node_id,
+        DomEventData::Input(BlitzInputEvent { value }),
+    ));
+}
+
 impl BaseDocument {
     pub(crate) fn apply_generated_text_input_event<F: FnMut(DomEvent)>(
         &mut self,
diff --git a/packages/blitz-dom/src/events/mod.rs b/packages/blitz-dom/src/events/mod.rs
index b1f0409d..d4c279ff 100644
--- a/packages/blitz-dom/src/events/mod.rs
+++ b/packages/blitz-dom/src/events/mod.rs
@@ -371,7 +371,14 @@ fn scroll_key_is_claimed_by(doc: &BaseDocument, node_id: NodeId, key: &Key) -> b
     }
     doc.get_node(node_id)
         .and_then(|node| node.element_data())
-        .is_some_and(|element| element.text_input_data().is_some())
+        .is_some_and(|element| {
+            element.text_input_data().is_some()
+                // A focussed select moves its selection with the arrows, Home
+                // and End. Without claiming them here the branch above scrolls
+                // the page and *returns*, so the keyboard handler never runs
+                // and a select could not be driven by keyboard at all.
+                || element.select_data().is_some()
+        })
 }
 
 /// The scroll a key asks for, in CSS pixels, or `None` if it asks for none.
diff --git a/packages/blitz-dom/src/events/pointer.rs b/packages/blitz-dom/src/events/pointer.rs
index 09d63e03..4bd3fd50 100644
--- a/packages/blitz-dom/src/events/pointer.rs
+++ b/packages/blitz-dom/src/events/pointer.rs
@@ -638,6 +638,12 @@ pub(crate) fn checkable_activation_target(doc: &BaseDocument, target: NodeId) ->
                 return Some(node_id);
             }
             local_name!("label") => return None,
+            // A select is not checkable and has an activation behaviour of its
+            // own, so the walk stops here for the same reason it stops at a
+            // text input: `handle_click` claims the press, and the two have to
+            // agree about where the walk ends or a checkbox wrapping a select
+            // would toggle without ever seeing a click.
+            local_name!("select") => return None,
             _ => {}
         }
 
@@ -716,6 +722,27 @@ pub(crate) fn handle_click(
 
                     break 'matched true;
                 }
+                // A press on a select focuses it. Nothing else yet: there is no
+                // popup to open.
+                //
+                // Without an arm of its own the walk fell through to the
+                // no-match tail below, which calls `clear_focus()`. Clicking a
+                // select therefore actively *unfocused* the page, and since the
+                // keyboard handler is gated on focus, the arrows could not
+                // drive a select the user had just pressed. `handle_pointerdown`
+                // is no help either: it classifies a select as
+                // `ClickTarget::SelectableText` and only the `TextInput` arm
+                // there generates focus events.
+                local_name!("select") => {
+                    generate_focus_events(
+                        doc,
+                        &mut |doc| {
+                            doc.set_focus_to(node_id);
+                        },
+                        dispatch_event,
+                    );
+                    break 'matched true;
+                }
                 // Activating the first <summary> of a <details> element toggles
                 // the details' `open` attribute (expand/collapse).
                 local_name!("summary") => {
diff --git a/packages/blitz-dom/src/form.rs b/packages/blitz-dom/src/form.rs
index 86f5a66f..e0e09202 100644
--- a/packages/blitz-dom/src/form.rs
+++ b/packages/blitz-dom/src/form.rs
@@ -267,11 +267,29 @@ fn construct_entry_list(doc: &BaseDocument, form_id: NodeId, submitter_id: NodeI
             continue;
         };
 
-        // TODO: If the field element is a select element,
-        //  then for each option element in the select element's
-        //  list of options whose selectedness is true and that is not disabled,
-        //  create an entry with name and the value of the option element,
-        //  and append it to entry list.
+        // If the field element is a select element, then for each option
+        // element in the select element's list of options whose selectedness is
+        // true and that is not disabled, create an entry with name and the
+        // value of the option element, and append it to entry list.
+        //
+        // Without this a select fell through to the generic tail below and
+        // submitted its own literal `value` attribute, which a select does not
+        // have. Every form containing a picker posted the wrong body.
+        if element.name.local == local_name!("select") {
+            let options = doc.select_options(control_id);
+            for (index, option_id) in options.iter().enumerate() {
+                let is_selected = element
+                    .select_data()
+                    .map(|data| data.is_selected(index))
+                    // Before layout construction has run there is no live
+                    // state, and the content attribute is all there is.
+                    .unwrap_or_else(|| doc.option_is_selected(*option_id));
+                if is_selected && !doc.option_is_disabled(*option_id) {
+                    create_entry(name, doc.option_value(*option_id).as_str().into());
+                }
+            }
+            continue;
+        }
 
         // Otherwise, if the field element is an input element whose type attribute is in the Checkbox state or the Radio Button state, then:
         if element.name.local == local_name!("input")
diff --git a/packages/blitz-dom/src/layout/construct.rs b/packages/blitz-dom/src/layout/construct.rs
index 101f0d08..1e37f020 100644
--- a/packages/blitz-dom/src/layout/construct.rs
+++ b/packages/blitz-dom/src/layout/construct.rs
@@ -501,6 +501,14 @@ pub(crate) fn collect_layout_children(
             }
         }
 
+        // A select has no in-flow content of its own: `option { display: none }`
+        // in the user-agent sheet sees to that, so returning here costs nothing
+        // and keeps the options out of the box the control occupies.
+        if tag_name == "select" {
+            create_select(doc, container_node_id);
+            return;
+        }
+
         #[cfg(feature = "svg")]
         if matches!(tag_name, "svg") {
             // Serialised rather than `outer_html`, so that symbols referenced
@@ -1118,6 +1126,24 @@ fn create_checkbox_input(doc: &mut BaseDocument, input_element_id: NodeId) {
     }
 }
 
+fn create_select(doc: &mut BaseDocument, select_element_id: NodeId) {
+    // Read before the node is borrowed mutably: the seed comes from the
+    // options, which are other nodes.
+    let initial = doc.initial_select_data(select_element_id);
+    let option_count = initial.len();
+
+    let node = &mut doc.nodes[select_element_id];
+    let element = &mut node.data.downcast_element_mut().unwrap();
+    match element.special_data {
+        // Construction runs again on every resolve. Re-seeding would put the
+        // control back to its parsed state on the next frame, so a selection
+        // made by the user or by script would survive exactly until anything
+        // else on the page changed. Only the option count is refreshed.
+        SpecialElementData::Select(ref mut data) => data.resize(option_count),
+        _ => element.special_data = SpecialElementData::Select(initial),
+    }
+}
+
 /// Find and return the "layout_children" (inline boxes) for an inline layout
 /// without actually constructing the layout. This allows us to defer the expensive
 /// construction of the Parley layout (which invokes text shaping) to a paralell phase.
diff --git a/packages/blitz-dom/src/layout/mod.rs b/packages/blitz-dom/src/layout/mod.rs
index 56bf5097..49dc1236 100644
--- a/packages/blitz-dom/src/layout/mod.rs
+++ b/packages/blitz-dom/src/layout/mod.rs
@@ -338,6 +338,15 @@ impl BaseDocument {
 /// sheet sees to that, and nothing replaces it. Without a measure of its own it
 /// laid out at zero and no site's country picker, currency picker or language
 /// picker had a box to press.
+///
+/// Still a character count rather than shaped text, because the options never
+/// reach layout and so are never shaped. What it counts is now the option's
+/// *label*, which is the string the control actually shows: a `label`
+/// attribute overrides the element's text, and the text is collapsed the way it
+/// would be rendered. Counting `text_content().trim()` measured the hidden text
+/// of a labelled option, and `trim()` only strips the ends, so a label whose own
+/// words were split across source lines counted the newline and the indentation
+/// before the next word and came out that much too wide.
 fn select_metrics_of(
     doc: &BaseDocument,
     node_id: blitz_traits::node_id::NodeId,
@@ -348,14 +357,10 @@ fn select_metrics_of(
         return None;
     }
 
-    let widest = crate::traversal::TreeTraverser::new_with_root(doc, node_id)
-        .filter_map(|descendant_id| doc.nodes.get(descendant_id))
-        .filter(|descendant| {
-            descendant
-                .data
-                .is_element_with_tag_name(&local_name!("option"))
-        })
-        .map(|option| option.text_content().trim().chars().count())
+    let widest = doc
+        .select_options(node_id)
+        .into_iter()
+        .map(|option_id| doc.option_label(option_id).chars().count())
         .max()
         .unwrap_or(0);
 
diff --git a/packages/blitz-dom/src/lib.rs b/packages/blitz-dom/src/lib.rs
index 6b83f9c8..70570688 100644
--- a/packages/blitz-dom/src/lib.rs
+++ b/packages/blitz-dom/src/lib.rs
@@ -53,6 +53,7 @@ mod mutator;
 pub mod paint_damage;
 mod query_selector;
 mod resolve;
+mod select;
 mod selection;
 #[cfg(feature = "shadow-dom")]
 mod shadow;
@@ -98,7 +99,7 @@ pub use markup5ever::{
     namespace_prefix, namespace_url, ns,
 };
 pub use mutator::DocumentMutator;
-pub use node::{Attribute, DocumentData, ElementData, Node, NodeData, TextNodeData};
+pub use node::{Attribute, DocumentData, ElementData, Node, NodeData, SelectData, TextNodeData};
 pub use paint_damage::PaintDamage;
 // Re-exported because `PaintDamage` takes and returns `kurbo::Rect` across the
 // crate boundary. A consumer that pulls kurbo in itself and lands on a
diff --git a/packages/blitz-dom/src/mutator.rs b/packages/blitz-dom/src/mutator.rs
index 4b6ef2c0..84dc62fd 100644
--- a/packages/blitz-dom/src/mutator.rs
+++ b/packages/blitz-dom/src/mutator.rs
@@ -497,6 +497,49 @@ impl DocumentMutator<'_> {
             || (tag, attr) == tag_and_attr!("iframe", "srcdoc")
         {
             self.load_iframe(node_id);
+        } else if (tag, attr) == tag_and_attr!("option", "selected") {
+            // `selected` is an HTML boolean attribute: present means selected,
+            // whatever the value reads. The same trap `checked` fell into, where
+            // `selected="false"` selected the option.
+            //
+            // Selectedness lives on the owning select once that has been
+            // constructed, and construction is idempotent, so writing the
+            // attribute alone would land nowhere anything reads. Before
+            // construction the attribute is the only carrier and seeds the
+            // state on the next resolve, which is why this is allowed to do
+            // nothing at all.
+            self.set_option_selected_state(node_id, true);
+        }
+    }
+
+    /// Push an option's selectedness into the owning select's live state, if
+    /// that state exists yet.
+    fn set_option_selected_state(&mut self, option_id: NodeId, selected: bool) {
+        let Some(select_id) = self.doc.option_owner_select(option_id) else {
+            return;
+        };
+        let Some(index) = self
+            .doc
+            .select_options(select_id)
+            .iter()
+            .position(|id| *id == option_id)
+        else {
+            return;
+        };
+        let changed = if selected {
+            self.doc.set_select_selected_index(select_id, index)
+        } else {
+            self.doc
+                .get_node_mut(select_id)
+                .and_then(|node| node.data.downcast_element_mut())
+                .and_then(|el| el.select_data_mut())
+                .is_some_and(|data| data.set_selected(index, false))
+        };
+        if changed {
+            // `option:checked` is matched from this state, so the restyle has
+            // to be asked for here or the change is invisible to CSS.
+            self.doc.snapshot_node(option_id);
+            self.doc.snapshot_node(select_id);
         }
     }
 
@@ -1392,6 +1435,7 @@ impl<'doc> DocumentMutator<'doc> {
                 SpecialElementData::TableRoot(_) => {}
                 SpecialElementData::TextInput(_) => {}
                 SpecialElementData::CheckboxInput(_) => {}
+                SpecialElementData::Select(_) => {}
                 #[cfg(feature = "file-input")]
                 SpecialElementData::FileInput(_) => {}
                 SpecialElementData::None => {}
diff --git a/packages/blitz-dom/src/node/element.rs b/packages/blitz-dom/src/node/element.rs
index 15075fb8..49061f72 100644
--- a/packages/blitz-dom/src/node/element.rs
+++ b/packages/blitz-dom/src/node/element.rs
@@ -32,7 +32,7 @@ use super::stylo_data::StyloData;
 use super::{Attribute, Attributes};
 use crate::Document;
 use crate::layout::table::TableContext;
-use crate::node::{TextBrush, TextInputData, TextLayout};
+use crate::node::{SelectData, TextBrush, TextInputData, TextLayout};
 
 #[cfg(feature = "shadow-dom")]
 use super::custom_element::CustomElementData;
@@ -383,6 +383,7 @@ pub enum SpecialElementType {
     TableRoot,
     TextInput,
     CheckboxInput,
+    Select,
     #[cfg(feature = "file-input")]
     FileInput,
     #[default]
@@ -412,6 +413,8 @@ pub enum SpecialElementData {
     TextInput(TextInputData),
     /// Checkbox checked state
     CheckboxInput(bool),
+    /// A \<select\> element's selectedness and open state
+    Select(SelectData),
     /// Selected files
     #[cfg(feature = "file-input")]
     FileInput(FileData),
@@ -434,6 +437,7 @@ impl Clone for SpecialElementData {
             Self::TableRoot(data) => Self::TableRoot(data.clone()),
             Self::TextInput(data) => Self::TextInput(data.clone()),
             Self::CheckboxInput(data) => Self::CheckboxInput(*data),
+            Self::Select(data) => Self::Select(data.clone()),
             #[cfg(feature = "file-input")]
             Self::FileInput(data) => Self::FileInput(data.clone()),
             Self::None => Self::None,
@@ -682,6 +686,27 @@ impl ElementData {
         }
     }
 
+    /// The live state of a `<select>`, or `None` for anything else.
+    ///
+    /// Deliberately not modelled the way `checkbox_input_checked` is: that one
+    /// hands back an `Option<bool>` whose `None` means both "not a checkbox"
+    /// and, to every caller that reaches for `unwrap_or(false)`, "unchecked".
+    /// A select's answer to "what is selected" is a whole vector, so the
+    /// borrow is handed out instead and the two questions stay apart.
+    pub fn select_data(&self) -> Option<&SelectData> {
+        match &self.special_data {
+            SpecialElementData::Select(data) => Some(data),
+            _ => None,
+        }
+    }
+
+    pub fn select_data_mut(&mut self) -> Option<&mut SelectData> {
+        match &mut self.special_data {
+            SpecialElementData::Select(data) => Some(data),
+            _ => None,
+        }
+    }
+
     #[cfg(feature = "file-input")]
     pub fn file_data(&self) -> Option<&FileData> {
         match &self.special_data {
@@ -1066,6 +1091,9 @@ impl std::fmt::Debug for SpecialElementData {
             SpecialElementData::TableRoot(_) => f.write_str("NodeSpecificData::TableRoot"),
             SpecialElementData::TextInput(_) => f.write_str("NodeSpecificData::TextInput"),
             SpecialElementData::CheckboxInput(_) => f.write_str("NodeSpecificData::CheckboxInput"),
+            SpecialElementData::Select(data) => {
+                write!(f, "NodeSpecificData::Select({data:?})")
+            }
             #[cfg(feature = "file-input")]
             SpecialElementData::FileInput(_) => f.write_str("NodeSpecificData::FileInput"),
             SpecialElementData::None => f.write_str("NodeSpecificData::None"),
diff --git a/packages/blitz-dom/src/node/mod.rs b/packages/blitz-dom/src/node/mod.rs
index 0178e069..75d8aa3f 100644
--- a/packages/blitz-dom/src/node/mod.rs
+++ b/packages/blitz-dom/src/node/mod.rs
@@ -8,6 +8,7 @@ mod custom_widget;
 mod element;
 mod node;
 pub(crate) mod scrollbar;
+mod select;
 mod stylo_data;
 mod text;
 
@@ -30,4 +31,5 @@ pub use element::{
 };
 pub use node::*;
 pub use scrollbar::{ScrollbarColor, ScrollbarRef, ScrollbarWidth};
+pub use select::SelectData;
 pub use text::{GeneratedTextInputEvent, TextBrush, TextInputData, TextLayout};
diff --git a/packages/blitz-dom/src/node/select.rs b/packages/blitz-dom/src/node/select.rs
new file mode 100644
index 00000000..41aa1745
--- /dev/null
+++ b/packages/blitz-dom/src/node/select.rs
@@ -0,0 +1,106 @@
+//! Live state for a `<select>` element.
+
+/// The selectedness of a `<select>` element's list of options, plus whether its
+/// drop-down is showing.
+///
+/// Positions, not node ids. `selectedIndex` is the spec's own handle on an
+/// option, and a position cannot dangle the way a stored id does once the
+/// option is removed from the tree. The list of options itself is recomputed
+/// from the subtree on every read, so a stale position is at worst out of
+/// range rather than pointing at some unrelated node.
+///
+/// A `Vec<bool>` rather than a single index because `<select multiple>` can
+/// have any number of options selected at once, and a single index would make
+/// the multiple case unrepresentable rather than merely unsupported.
+#[derive(Clone, Debug, Default, PartialEq, Eq)]
+pub struct SelectData {
+    selected: Vec<bool>,
+    open: bool,
+}
+
+impl SelectData {
+    /// Seed the state with one entry per option, in the select's list order.
+    pub fn new(selected: Vec<bool>) -> Self {
+        Self {
+            selected,
+            open: false,
+        }
+    }
+
+    /// Grow or shrink to `len` options, keeping the selectedness of the options
+    /// that are still there.
+    ///
+    /// Layout construction runs again on every resolve, so this is the only
+    /// place a script-added `<option>` gets an entry of its own. Re-seeding
+    /// from the `selected` content attributes instead would throw away whatever
+    /// the user had actually chosen the moment anything else on the page
+    /// changed.
+    pub fn resize(&mut self, len: usize) {
+        self.selected.resize(len, false);
+    }
+
+    /// The number of options the state has entries for.
+    pub fn len(&self) -> usize {
+        self.selected.len()
+    }
+
+    pub fn is_empty(&self) -> bool {
+        self.selected.is_empty()
+    }
+
+    /// Whether the option at `index` is selected. Out of range reads `false`.
+    pub fn is_selected(&self, index: usize) -> bool {
+        self.selected.get(index).copied().unwrap_or(false)
+    }
+
+    /// The first selected option, which is `selectedIndex` for a single select.
+    pub fn selected_index(&self) -> Option<usize> {
+        self.selected.iter().position(|selected| *selected)
+    }
+
+    /// Set one option's selectedness without touching the others. Returns
+    /// whether it changed.
+    pub fn set_selected(&mut self, index: usize, selected: bool) -> bool {
+        match self.selected.get_mut(index) {
+            Some(entry) if *entry != selected => {
+                *entry = selected;
+                true
+            }
+            _ => false,
+        }
+    }
+
+    /// Select `index` and clear every other option. Returns whether anything
+    /// changed.
+    pub fn select_only(&mut self, index: usize) -> bool {
+        if index >= self.selected.len() {
+            return false;
+        }
+        let mut changed = false;
+        for (i, entry) in self.selected.iter_mut().enumerate() {
+            let want = i == index;
+            changed |= *entry != want;
+            *entry = want;
+        }
+        changed
+    }
+
+    /// Deselect every option. Returns whether anything changed.
+    pub fn clear_selection(&mut self) -> bool {
+        let mut changed = false;
+        for entry in self.selected.iter_mut() {
+            changed |= *entry;
+            *entry = false;
+        }
+        changed
+    }
+
+    /// Whether the drop-down list is showing.
+    pub fn is_open(&self) -> bool {
+        self.open
+    }
+
+    pub fn set_open(&mut self, open: bool) {
+        self.open = open;
+    }
+}
diff --git a/packages/blitz-dom/src/resolve.rs b/packages/blitz-dom/src/resolve.rs
index afdf500f..78ab8b56 100644
--- a/packages/blitz-dom/src/resolve.rs
+++ b/packages/blitz-dom/src/resolve.rs
@@ -290,6 +290,8 @@ impl BaseDocument {
         }
         #[cfg(target_arch = "wasm32")]
         self.resolve_layout();
+        self.resolve_sticky_positions();
+        self.resolve_fixed_positions();
         self.resolve_hoisted_positions();
         self.correct_hoisted_fixed_positions();
         self.resolve_hoisted_clips();
@@ -311,6 +313,8 @@ impl BaseDocument {
             }
             self.flush_styles_to_layout(root_node_id);
             self.resolve_layout();
+            self.resolve_sticky_positions();
+            self.resolve_fixed_positions();
             self.resolve_hoisted_positions();
             self.correct_hoisted_fixed_positions();
             self.resolve_hoisted_clips();
@@ -685,11 +689,19 @@ impl BaseDocument {
     ///
     /// <https://drafts.csswg.org/css-position/#fixed-pos>
     /// <https://drafts.csswg.org/css-transforms-1/#propdef-transform>
+    ///
+    /// The same walk collects `position: sticky` nodes into
+    /// [`Self::sticky_nodes`]. Nothing about the two is related, but both need
+    /// one pre-order pass over the box tree, and a second walk would be paid on
+    /// every frame of every document whether or not it has a sticky box in it.
     pub fn hoist_fixed_position_nodes(&mut self) {
         let root_id = self.root_element().id;
 
         let mut hoisted: Vec<NodeId> = Vec::new();
-        collect_fixed(self, root_id, false, &mut hoisted);
+        let mut sticky: Vec<NodeId> = Vec::new();
+        collect_fixed(self, root_id, false, &mut hoisted, &mut sticky);
+        self.sticky_nodes = sticky;
+        self.fixed_nodes = hoisted.clone();
 
         // Drop nodes that are no longer fixed, and keep the rest.
         //
@@ -735,6 +747,7 @@ impl BaseDocument {
             node_id: NodeId,
             under_transform: bool,
             out: &mut Vec<NodeId>,
+            sticky: &mut Vec<NodeId>,
         ) {
             let children = doc.nodes[node_id].layout_children.borrow().clone();
             let Some(children) = children else {
@@ -761,8 +774,10 @@ impl BaseDocument {
                     continue;
                 }
 
-                if !under_transform && styles.clone_position() == Position::Fixed {
-                    out.push(child_id);
+                match styles.clone_position() {
+                    Position::Fixed if !under_transform => out.push(child_id),
+                    Position::Sticky => sticky.push(child_id),
+                    _ => {}
                 }
 
                 collect_fixed(
@@ -770,6 +785,7 @@ impl BaseDocument {
                     child_id,
                     under_transform || establishes_containing_block(&styles),
                     out,
+                    sticky,
                 );
             }
         }
@@ -787,6 +803,275 @@ impl BaseDocument {
         }
     }
 
+    /// Hold every viewport-anchored `position: fixed` box still while the page
+    /// scrolls under it.
+    ///
+    /// Paint translates the whole tree by the negated viewport scroll, and a
+    /// hoisted fixed layer is in that tree like everything else, so a fixed box
+    /// held its document position and left the screen exactly like flow
+    /// content: an overlay authored `top: 0` painted at screen y=-800 on a page
+    /// scrolled 800px down. Its document position has to track the scroll for
+    /// its screen position to hold still, which is the whole of the correction.
+    ///
+    /// Boxes under a transformed ancestor are left alone: that ancestor is
+    /// their containing block, so they are not viewport-anchored at all and
+    /// `hoist_fixed_position_nodes` does not collect them.
+    ///
+    /// This does not give a fixed box the containing block CSS asks for. That
+    /// is still the root element, which takes its height from its content, so
+    /// `bottom` and `inset` resolve against the document rather than against a
+    /// viewport-sized initial containing block. Closing that needs an ICB node
+    /// distinct from the root element, which `fixed_position.rs` records as an
+    /// ignored test.
+    pub(crate) fn resolve_fixed_positions(&mut self) {
+        let scroll = self.viewport_scroll;
+        if scroll == self.fixed_scroll_offset {
+            return;
+        }
+        let delta_x = (scroll.x - self.fixed_scroll_offset.x) as f32;
+        let delta_y = (scroll.y - self.fixed_scroll_offset.y) as f32;
+
+        for &node_id in self.fixed_nodes.iter() {
+            let Some(node) = self.nodes.get_mut(node_id) else {
+                continue;
+            };
+            let location = &mut node.final_layout_mut().location;
+            location.x += delta_x;
+            location.y += delta_y;
+        }
+        self.fixed_scroll_offset = scroll;
+    }
+
+    /// Hold every `position: sticky` box against the edge of its scrollport.
+    ///
+    /// A sticky box lays out in flow, reserving its space there, and is then
+    /// displaced so that it stays between its own flow position and the far
+    /// edge of its containing block. `stylo_taffy` maps `Position::Sticky` onto
+    /// `taffy::Position::Relative`, which gets the first half right and does
+    /// nothing at all about the second, so every sticky navbar and document
+    /// sidebar on the fleet simply scrolled away, on documents 5,000 to
+    /// 16,700px tall.
+    ///
+    /// The displacement is written straight into the box's
+    /// `final_layout().location` rather than kept beside it. Paint, hit testing
+    /// and `absolute_position` all read that one field, so writing it is what
+    /// makes them agree; a parallel offset would have to be threaded through
+    /// each of them and would disagree the moment one was missed. The cost is
+    /// that this pass has to be able to recover the flow position it started
+    /// from, which is what [`Self::sticky_offsets`] records.
+    ///
+    /// Runs after layout, which is the only point at which the boxes it reads
+    /// exist, and again after a scroll, because a wheel event does not
+    /// necessarily produce a style and layout pass.
+    ///
+    /// <https://drafts.csswg.org/css-position/#stickypos-insets>
+    pub(crate) fn resolve_sticky_positions(&mut self) {
+        if self.sticky_nodes.is_empty() && self.sticky_offsets.is_empty() {
+            return;
+        }
+
+        // Put every box back at its flow position first. Recomputing from an
+        // already-displaced box would compound the offset, walking a header
+        // down the page one scroll at a time, and a node that stopped being
+        // sticky since the last pass is not in `sticky_nodes` to be corrected
+        // any other way.
+        for (&node_id, offset) in self.sticky_offsets.iter() {
+            let Some(node) = self.nodes.get_mut(node_id) else {
+                continue;
+            };
+            let location = &mut node.final_layout_mut().location;
+            location.x -= offset.x;
+            location.y -= offset.y;
+        }
+        self.sticky_offsets.clear();
+
+        let nodes = std::mem::take(&mut self.sticky_nodes);
+        for &node_id in nodes.iter() {
+            let Some(offset) = self.sticky_offset_of(node_id) else {
+                continue;
+            };
+            if offset.x == 0.0 && offset.y == 0.0 {
+                continue;
+            }
+            let location = &mut self.nodes[node_id].final_layout_mut().location;
+            location.x += offset.x;
+            location.y += offset.y;
+            self.sticky_offsets.insert(node_id, offset);
+        }
+        self.sticky_nodes = nodes;
+    }
+
+    /// The displacement `node_id` needs to stay inside its sticky view
+    /// rectangle, given the boxes and scroll offsets as they stand.
+    ///
+    /// Every coordinate here is a painted document coordinate:
+    /// `absolute_position` has already applied each ancestor scroll offset, so
+    /// a box and the scrollport it is measured against are directly comparable.
+    /// The one scroll offset it does not apply is the viewport's, which paint
+    /// subtracts from the whole document, so a box that holds still on screen
+    /// is one whose document coordinate tracks the viewport scroll.
+    fn sticky_offset_of(&self, node_id: NodeId) -> Option<taffy::Point<f32>> {
+        let node = self.nodes.get(node_id)?;
+        let styles = node.primary_styles()?;
+        if styles.clone_position() != Position::Sticky {
+            return None;
+        }
+
+        let size = node.final_layout().size;
+        let base = node.absolute_position(0.0, 0.0);
+
+        // The sticky view rectangle: the padding box of the nearest scroll
+        // container, or the viewport when there is none above it.
+        let (port_x, port_y, port_width, port_height) = match self.nearest_scrollport(node_id) {
+            Some(scroller_id) => {
+                let scroller = &self.nodes[scroller_id];
+                let layout = *scroller.final_layout();
+                let origin = scroller.absolute_position(0.0, 0.0);
+                (
+                    origin.x + layout.border.left,
+                    origin.y + layout.border.top,
+                    layout.size.width - layout.border.left - layout.border.right,
+                    layout.size.height - layout.border.top - layout.border.bottom,
+                )
+            }
+            None => {
+                let scale = self.viewport.scale();
+                (
+                    self.viewport_scroll.x as f32,
+                    self.viewport_scroll.y as f32,
+                    self.viewport.window_size.0 as f32 / scale,
+                    self.viewport.window_size.1 as f32 / scale,
+                )
+            }
+        };
+
+        let insets = styles.get_position();
+        // Percentages resolve against the sticky view rectangle, which is the
+        // rectangle the inset is measured inside.
+        let inset = |value: &style::values::computed::Inset, basis: f32| {
+            use style::values::generics::position::GenericInset as Inset;
+            match value {
+                Inset::LengthPercentage(value) => Some(
+                    value
+                        .resolve(style::values::computed::Length::new(basis))
+                        .px(),
+                ),
+                _ => None,
+            }
+        };
+
+        // Where the box may travel: its containing block, which is its layout
+        // parent's padding box, taken in the same painted coordinates. The
+        // parent's own scroll offset is subtracted because the region scrolls
+        // with the content, and the extent is widened to the scrollable content
+        // so that a sticky box whose parent *is* the scroller stays held for
+        // the whole scroll rather than only across one scrollport.
+        let parent = node
+            .layout_parent
+            .get()
+            .and_then(|parent_id| self.nodes.get(parent_id))?;
+        let (block_x, block_y, block_width, block_height) = {
+            let layout = *parent.final_layout();
+            let origin = parent.absolute_position(0.0, 0.0);
+            let scroll = *parent.scroll_offset();
+            (
+                origin.x + layout.border.left - scroll.x as f32,
+                origin.y + layout.border.top - scroll.y as f32,
+                (layout.size.width - layout.border.left - layout.border.right)
+                    .max(layout.content_size.width),
+                (layout.size.height - layout.border.top - layout.border.bottom)
+                    .max(layout.content_size.height),
+            )
+        };
+
+        let axis = |start: Option<f32>,
+                    end: Option<f32>,
+                    base: f32,
+                    extent: f32,
+                    port_start: f32,
+                    port_extent: f32,
+                    block_start: f32,
+                    block_extent: f32| {
+            // `start` (top/left) pushes the box away from the near edge of the
+            // scrollport; `end` (bottom/right) pulls it back from the far one.
+            // A box can satisfy both at once when it is smaller than the
+            // rectangle between them; when it cannot, the near edge wins, so
+            // that constraint is applied second.
+            let mut offset = 0.0f32;
+            if let Some(end) = end {
+                offset = (port_start + port_extent - end - extent - base).min(0.0);
+            }
+            if let Some(start) = start {
+                let shift = (port_start + start - base).max(0.0);
+                if shift > 0.0 {
+                    offset = shift;
+                }
+            }
+
+            // Stickiness ends where the containing block does: a box pinned for
+            // ever would escape its own section and float over the next one.
+            let furthest = (block_start + block_extent - extent - base).max(0.0);
+            let nearest = (block_start - base).min(0.0);
+            offset.clamp(nearest, furthest)
+        };
+
+        Some(taffy::Point {
+            x: axis(
+                inset(&insets.left, port_width),
+                inset(&insets.right, port_width),
+                base.x,
+                size.width,
+                port_x,
+                port_width,
+                block_x,
+                block_width,
+            ),
+            y: axis(
+                inset(&insets.top, port_height),
+                inset(&insets.bottom, port_height),
+                base.y,
+                size.height,
+                port_y,
+                port_height,
+                block_y,
+                block_height,
+            ),
+        })
+    }
+
+    /// The nearest ancestor of `node_id` that scrolls its content, or `None`
+    /// when nothing between it and the root does and the viewport is the
+    /// scrollport.
+    ///
+    /// The root element is excluded deliberately: per the CSS overflow
+    /// propagation rules its overflow belongs to the viewport, which is also
+    /// why `scroll_node_by_has_changed` forwards a scroll that reaches it.
+    fn nearest_scrollport(&self, node_id: NodeId) -> Option<NodeId> {
+        use style::computed_values::overflow_x::T as Overflow;
+
+        let root_id = self.try_root_element()?.id;
+        let mut current = self.nodes.get(node_id)?.layout_parent.get();
+        while let Some(id) = current {
+            if id == root_id {
+                return None;
+            }
+            let ancestor = self.nodes.get(id)?;
+            if let Some(styles) = ancestor.primary_styles() {
+                let scrolls = |overflow| {
+                    matches!(
+                        overflow,
+                        Overflow::Scroll | Overflow::Auto | Overflow::Hidden
+                    )
+                };
+                if scrolls(styles.clone_overflow_x()) || scrolls(styles.clone_overflow_y()) {
+                    return Some(id);
+                }
+            }
+            current = ancestor.layout_parent.get();
+        }
+        None
+    }
+
     /// Give each held fixed layer the offset that cancels its hoist.
     ///
     /// Paint draws a hoisted child at its stacking context root's origin, plus
@@ -1058,6 +1343,14 @@ impl BaseDocument {
         taffy::compute_root_layout(self, root_element_id, available_space);
         taffy::round_layout(self, root_element_id);
 
+        // Rounding rewrites every location from taffy's own output, discarding
+        // the sticky and fixed displacements written into them along with
+        // everything else. Forgetting them here is what keeps
+        // `resolve_sticky_positions` and `resolve_fixed_positions` able to
+        // treat what they hold as "what is currently baked into a box".
+        self.sticky_offsets.clear();
+        self.fixed_scroll_offset = crate::Point::ZERO;
+
         // Table rows and row groups are flattened into a grid of cells and
         // never reach Taffy, so nothing wrote a layout for them at all. Describe
         // each from the cells it holds, after rounding: `final_layout` is what
diff --git a/packages/blitz-dom/src/select.rs b/packages/blitz-dom/src/select.rs
new file mode 100644
index 00000000..879eb18d
--- /dev/null
+++ b/packages/blitz-dom/src/select.rs
@@ -0,0 +1,350 @@
+//! The `<select>` element's list of options and its selectedness.
+//!
+//! There was no notion of selectedness anywhere in the engine: an `<option>`
+//! was a `display: none` node with a `selected` attribute nobody read, so a
+//! select could be measured and pressed but could not say what it offered or
+//! what was chosen. A QA harness driving worktables.dev's schema designer had
+//! nothing to assert against and nothing to change.
+
+use crate::node::SelectData;
+use crate::traversal::TreeTraverser;
+use crate::{BaseDocument, local_name};
+use blitz_traits::node_id::NodeId;
+
+impl BaseDocument {
+    /// A select's *list of options*: every descendant `<option>` in tree order.
+    ///
+    /// A subtree walk rather than a scan of the direct children, because
+    /// `<optgroup>` nests them one level down and the flattened order is what
+    /// `selectedIndex` counts.
+    ///
+    /// Recomputed on every call rather than cached on the select. The cached
+    /// form would have to be invalidated from every mutation path that can add
+    /// or remove an option, and the walk is over a handful of nodes.
+    pub fn select_options(&self, select_id: NodeId) -> Vec<NodeId> {
+        if !self
+            .get_node(select_id)
+            .is_some_and(|node| node.data.is_element_with_tag_name(&local_name!("select")))
+        {
+            return Vec::new();
+        }
+        TreeTraverser::new_with_root(self, select_id)
+            .filter(|id| {
+                self.get_node(*id)
+                    .is_some_and(|node| node.data.is_element_with_tag_name(&local_name!("option")))
+            })
+            .collect()
+    }
+
+    /// Whether the option is disabled, either in itself or through the
+    /// `<optgroup>` containing it. A disabled option cannot be picked and is
+    /// skipped by the arrow keys.
+    pub fn option_is_disabled(&self, option_id: NodeId) -> bool {
+        let mut current = Some(option_id);
+        while let Some(id) = current {
+            let Some(node) = self.get_node(id) else {
+                return false;
+            };
+            let Some(el) = node.data.downcast_element() else {
+                return false;
+            };
+            if el.attr(local_name!("disabled")).is_some() {
+                return true;
+            }
+            if el.name.local == local_name!("select") {
+                // The select's own `disabled` is the control's, not the
+                // option's; stop before inheriting it.
+                return false;
+            }
+            current = node.parent;
+        }
+        false
+    }
+
+    /// An option's label: the `label` attribute if it has one, otherwise its
+    /// stripped-and-collapsed text. This is what the option shows and what the
+    /// accessibility tree reports as its name.
+    pub fn option_label(&self, option_id: NodeId) -> String {
+        let Some(node) = self.get_node(option_id) else {
+            return String::new();
+        };
+        if let Some(label) = node.data.downcast_element().and_then(|el| {
+            el.attr(local_name!("label"))
+                .filter(|label| !label.is_empty())
+        }) {
+            return label.to_string();
+        }
+        collapse_whitespace(&node.text_content())
+    }
+
+    /// An option's submission value: the `value` attribute if present,
+    /// otherwise its label. An empty `value=""` is a value, not an absence,
+    /// which is why this tests for the attribute rather than for a non-empty
+    /// string.
+    pub fn option_value(&self, option_id: NodeId) -> String {
+        let Some(node) = self.get_node(option_id) else {
+            return String::new();
+        };
+        if let Some(value) = node
+            .data
+            .downcast_element()
+            .and_then(|el| el.attr(local_name!("value")))
+        {
+            return value.to_string();
+        }
+        self.option_label(option_id)
+    }
+
+    /// The selectedness a freshly constructed select should start with.
+    ///
+    /// The `selected` content attribute seeds it. A single select then has to
+    /// end up with exactly one option selected if it has any enabled ones at
+    /// all: HTML's *ask for a reset* step picks the last option carrying the
+    /// attribute, or the first non-disabled option when none does. Without that
+    /// last part a plain `<select>` with no `selected` anywhere would report an
+    /// empty value, which is not what it submits or displays.
+    pub fn initial_select_data(&self, select_id: NodeId) -> SelectData {
+        let options = self.select_options(select_id);
+        let mut selected: Vec<bool> = options
+            .iter()
+            .map(|id| {
+                self.get_node(*id)
+                    .and_then(|node| node.data.downcast_element())
+                    .is_some_and(|el| el.attr(local_name!("selected")).is_some())
+            })
+            .collect();
+
+        let multiple = self
+            .get_node(select_id)
+            .and_then(|node| node.data.downcast_element())
+            .is_some_and(|el| el.attr(local_name!("multiple")).is_some());
+
+        if !multiple {
+            let last = selected.iter().rposition(|s| *s);
+            let chosen = last.or_else(|| {
+                options
+                    .iter()
+                    .position(|id| !self.option_is_disabled(*id))
+                    .filter(|_| self.select_display_size(select_id) <= 1)
+            });
+            for (i, entry) in selected.iter_mut().enumerate() {
+                *entry = Some(i) == chosen;
+            }
+        }
+
+        SelectData::new(selected)
+    }
+
+    /// The number of rows the select shows: `size`, or one for a drop-down and
+    /// four for a `multiple` list box, which is what browsers settled on.
+    ///
+    /// Only the "is this a drop-down" question is asked of it here: a list box
+    /// (`size` greater than one) does *not* auto-select its first option, while
+    /// a drop-down must, because a drop-down always displays something.
+    pub fn select_display_size(&self, select_id: NodeId) -> u32 {
+        let Some(el) = self
+            .get_node(select_id)
+            .and_then(|node| node.data.downcast_element())
+        else {
+            return 1;
+        };
+        el.attr(local_name!("size"))
+            .and_then(|size| size.parse::<u32>().ok())
+            .filter(|rows| *rows >= 1)
+            .unwrap_or(if el.attr(local_name!("multiple")).is_some() {
+                4
+            } else {
+                1
+            })
+    }
+
+    /// The node id of the select's currently selected option, if any.
+    pub fn select_selected_option(&self, select_id: NodeId) -> Option<NodeId> {
+        let data = self
+            .get_node(select_id)?
+            .data
+            .downcast_element()?
+            .select_data()?;
+        let index = data.selected_index()?;
+        self.select_options(select_id).get(index).copied()
+    }
+
+    /// A select's value: the value of its first selected option, or the empty
+    /// string when nothing is selected. This is `HTMLSelectElement.value`.
+    pub fn select_value(&self, select_id: NodeId) -> String {
+        self.select_selected_option(select_id)
+            .map(|option_id| self.option_value(option_id))
+            .unwrap_or_default()
+    }
+
+    /// The label of the select's selected option, which is what the control
+    /// displays and what the accessibility tree reports as its value.
+    pub fn select_label(&self, select_id: NodeId) -> String {
+        self.select_selected_option(select_id)
+            .map(|option_id| self.option_label(option_id))
+            .unwrap_or_default()
+    }
+
+    /// `selectedIndex`, or `None` when nothing is selected.
+    pub fn select_selected_index(&self, select_id: NodeId) -> Option<usize> {
+        self.get_node(select_id)?
+            .data
+            .downcast_element()?
+            .select_data()?
+            .selected_index()
+    }
+
+    /// Whether the option is selected, according to the parent select's live
+    /// state when it has any and the `selected` content attribute before
+    /// construction has run.
+    pub fn option_is_selected(&self, option_id: NodeId) -> bool {
+        match self.option_owner_select(option_id) {
+            Some(select_id) => {
+                let index = self
+                    .select_options(select_id)
+                    .iter()
+                    .position(|id| *id == option_id);
+                match (index, self.select_live_data(select_id)) {
+                    (Some(index), Some(data)) => data.is_selected(index),
+                    _ => self.option_has_selected_attr(option_id),
+                }
+            }
+            None => self.option_has_selected_attr(option_id),
+        }
+    }
+
+    /// The `<select>` an option belongs to, walking out through any
+    /// `<optgroup>`.
+    pub fn option_owner_select(&self, option_id: NodeId) -> Option<NodeId> {
+        let mut current = self.get_node(option_id)?.parent;
+        while let Some(id) = current {
+            let node = self.get_node(id)?;
+            if node.data.is_element_with_tag_name(&local_name!("select")) {
+                return Some(id);
+            }
+            current = node.parent;
+        }
+        None
+    }
+
+    fn select_live_data(&self, select_id: NodeId) -> Option<&SelectData> {
+        self.get_node(select_id)?
+            .data
+            .downcast_element()?
+            .select_data()
+    }
+
+    fn option_has_selected_attr(&self, option_id: NodeId) -> bool {
+        self.get_node(option_id)
+            .and_then(|node| node.data.downcast_element())
+            .is_some_and(|el| el.attr(local_name!("selected")).is_some())
+    }
+
+    /// Select the option at `index`, clearing the others on a single select.
+    /// Returns whether the selection actually changed, so a caller can decide
+    /// whether an `input` event is owed.
+    ///
+    /// Selecting a disabled option is refused rather than ignored, because the
+    /// keyboard handler steps over disabled options and a script that asks for
+    /// one directly should not end up with a value the control would never
+    /// submit.
+    pub fn set_select_selected_index(&mut self, select_id: NodeId, index: usize) -> bool {
+        let options = self.select_options(select_id);
+        if options
+            .get(index)
+            .is_none_or(|id| self.option_is_disabled(*id))
+        {
+            return false;
+        }
+        let multiple = self
+            .get_node(select_id)
+            .and_then(|node| node.data.downcast_element())
+            .is_some_and(|el| el.attr(local_name!("multiple")).is_some());
+        let option_count = options.len();
+
+        let Some(data) = self
+            .get_node_mut(select_id)
+            .and_then(|node| node.data.downcast_element_mut())
+            .and_then(|el| el.select_data_mut())
+        else {
+            return false;
+        };
+        // Construction sizes this, but a script can append an <option> and set
+        // it selected before the next resolve has run, at which point the entry
+        // does not exist yet and the write would be silently dropped.
+        data.resize(option_count);
+        if multiple {
+            data.set_selected(index, true)
+        } else {
+            data.select_only(index)
+        }
+    }
+
+    /// The index the arrow keys move to from the current selection, skipping
+    /// disabled options. `None` when there is nowhere to go.
+    pub fn select_index_step(&self, select_id: NodeId, forwards: bool) -> Option<usize> {
+        let options = self.select_options(select_id);
+        if options.is_empty() {
+            return None;
+        }
+        let current = self.select_selected_index(select_id);
+        let mut index = match current {
+            Some(current) => current as isize,
+            // With nothing selected, the first press lands on the end the key
+            // points away from rather than moving off nowhere.
+            None => {
+                return options
+                    .iter()
+                    .enumerate()
+                    .filter(|(_, id)| !self.option_is_disabled(**id))
+                    .map(|(i, _)| i)
+                    .next_back()
+                    .filter(|_| !forwards)
+                    .or_else(|| {
+                        options
+                            .iter()
+                            .position(|id| !self.option_is_disabled(*id))
+                            .filter(|_| forwards)
+                    });
+            }
+        };
+        loop {
+            index += if forwards { 1 } else { -1 };
+            if index < 0 || index as usize >= options.len() {
+                return None;
+            }
+            if !self.option_is_disabled(options[index as usize]) {
+                return Some(index as usize);
+            }
+        }
+    }
+
+    /// The first or last selectable option, for Home and End.
+    pub fn select_index_edge(&self, select_id: NodeId, last: bool) -> Option<usize> {
+        let options = self.select_options(select_id);
+        let mut enabled = options
+            .iter()
+            .enumerate()
+            .filter(|(_, id)| !self.option_is_disabled(**id))
+            .map(|(i, _)| i);
+        if last {
+            enabled.next_back()
+        } else {
+            enabled.next()
+        }
+    }
+}
+
+/// Strip and collapse the way an option's label is rendered. Authors indent
+/// their markup, so the raw text of `<option>\n  France\n</option>` is neither
+/// what is shown nor what is submitted.
+fn collapse_whitespace(text: &str) -> String {
+    let mut out = String::with_capacity(text.len());
+    for word in text.split_whitespace() {
+        if !out.is_empty() {
+            out.push(' ');
+        }
+        out.push_str(word);
+    }
+    out
+}
diff --git a/packages/blitz-script/src/dom/element.rs b/packages/blitz-script/src/dom/element.rs
index 1cee8965..f63c7314 100644
--- a/packages/blitz-script/src/dom/element.rs
+++ b/packages/blitz-script/src/dom/element.rs
@@ -40,6 +40,21 @@ pub(crate) fn init_element_proto(proto: &JsObject, context: &mut Context) {
         Some(set_checked),
         context,
     );
+    define_accessor(
+        proto,
+        "selectedIndex",
+        Some(get_selected_index),
+        Some(set_selected_index),
+        context,
+    );
+    define_accessor(
+        proto,
+        "selected",
+        Some(get_selected),
+        Some(set_selected),
+        context,
+    );
+    define_accessor(proto, "options", Some(get_options), None, context);
     define_accessor(
         proto,
         "disabled",
@@ -484,9 +499,29 @@ fn set_autofocus(this: &JsValue, args: &[JsValue], context: &mut Context) -> JsR
     Ok(JsValue::undefined())
 }
 
+/// Whether the node is a `<select>`.
+///
+/// Tag-guarded rather than given a prototype of its own: every element shares
+/// one `Element` prototype here, exactly as `get_value` already branches on
+/// `text_input_data()` rather than on the tag having its own object.
+fn is_select(ctx: &DomCtx, node_id: NodeId) -> bool {
+    let doc = ctx.doc.borrow();
+    doc.get_node(node_id).is_some_and(|node| {
+        node.data
+            .is_element_with_tag_name(&blitz_dom::local_name!("select"))
+    })
+}
+
 fn get_value(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
     let ctx = dom_ctx(context)?;
     let node_id = this_node_id(this)?;
+    if is_select(&ctx, node_id) {
+        // A select has no `value` attribute of its own, so the generic tail
+        // below read an attribute that is never there and every picker
+        // reported the empty string.
+        let value = ctx.doc.borrow().select_value(node_id);
+        return Ok(js_str(&value));
+    }
     let value = {
         let doc = ctx.doc.borrow();
         doc.get_node(node_id)
@@ -506,9 +541,168 @@ fn get_value(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<J
 }
 
 fn set_value(this: &JsValue, args: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    if is_select(&ctx, node_id) {
+        let value = to_rust_string(args.first().unwrap_or(&JsValue::undefined()), context)?;
+        select_by_value(&ctx, node_id, &value);
+        return Ok(JsValue::undefined());
+    }
     attr_setter("value", this, args, context)
 }
 
+/// Select the first option whose value matches, or deselect everything when
+/// none does, which is what `HTMLSelectElement.value` does on a single select.
+///
+/// Live state, then snapshot: the same rule `set_checked` is written to. The
+/// selectedness in special data is what the accessibility tree, form
+/// submission and `change` all read, and the snapshot is what asks for the
+/// restyle that a state-derived selector needs.
+fn select_by_value(ctx: &DomCtx, node_id: NodeId, value: &str) {
+    let target = {
+        let doc = ctx.doc.borrow();
+        doc.select_options(node_id)
+            .into_iter()
+            .position(|option_id| doc.option_value(option_id) == value)
+    };
+    let mut doc = ctx.mutate_doc();
+    let changed = match target {
+        Some(index) => doc.set_select_selected_index(node_id, index),
+        None => doc
+            .get_node_mut(node_id)
+            .and_then(|node| node.data.downcast_element_mut())
+            .and_then(|el| el.select_data_mut())
+            .is_some_and(|data| data.clear_selection()),
+    };
+    if changed {
+        doc.snapshot_node(node_id);
+    }
+}
+
+fn get_selected_index(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    // -1 for "nothing selected", which is what the IDL says and what every
+    // caller comparing against a numeric index expects.
+    let index = ctx
+        .doc
+        .borrow()
+        .select_selected_index(node_id)
+        .map(|index| index as i64)
+        .unwrap_or(-1);
+    Ok(JsValue::from(index))
+}
+
+fn set_selected_index(
+    this: &JsValue,
+    args: &[JsValue],
+    context: &mut Context,
+) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    let index = args
+        .first()
+        .map(|value| value.to_number(context))
+        .transpose()?
+        .unwrap_or(-1.0);
+
+    let mut doc = ctx.mutate_doc();
+    let changed = if index < 0.0 {
+        doc.get_node_mut(node_id)
+            .and_then(|node| node.data.downcast_element_mut())
+            .and_then(|el| el.select_data_mut())
+            .is_some_and(|data| data.clear_selection())
+    } else {
+        doc.set_select_selected_index(node_id, index as usize)
+    };
+    if changed {
+        doc.snapshot_node(node_id);
+    }
+    Ok(JsValue::undefined())
+}
+
+/// A select's `options` collection: its list of options, flattened out of any
+/// `<optgroup>`, which is what `selectedIndex` counts against.
+fn get_options(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    let option_ids = ctx.doc.borrow().select_options(node_id);
+    let wrappers: Vec<JsValue> = option_ids
+        .into_iter()
+        .map(|option_id| node_wrapper(&ctx, option_id, context).into())
+        .collect();
+    Ok(boa_engine::object::builtins::JsArray::from_iter(wrappers, context).into())
+}
+
+fn get_selected(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    let selected = ctx.doc.borrow().option_is_selected(node_id);
+    Ok(JsValue::from(selected))
+}
+
+fn set_selected(this: &JsValue, args: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
+    let ctx = dom_ctx(context)?;
+    let node_id = this_node_id(this)?;
+    let selected = args.first().map(JsValue::to_boolean).unwrap_or(false);
+
+    let owner = {
+        let doc = ctx.doc.borrow();
+        doc.option_owner_select(node_id).map(|select_id| {
+            let index = doc
+                .select_options(select_id)
+                .into_iter()
+                .position(|id| id == node_id);
+            (select_id, index)
+        })
+    };
+    let Some((select_id, Some(index))) = owner else {
+        // An option outside a select has nowhere to record selectedness, so
+        // the attribute is all there is.
+        if selected {
+            write_attr(&ctx, node_id, "selected", "");
+        } else {
+            clear_attr(&ctx, node_id, "selected");
+        }
+        return Ok(JsValue::undefined());
+    };
+
+    let mut doc = ctx.mutate_doc();
+    let has_live_state = doc
+        .get_node(select_id)
+        .and_then(|node| node.data.downcast_element())
+        .is_some_and(|el| el.select_data().is_some());
+    if has_live_state {
+        let changed = if selected {
+            doc.set_select_selected_index(select_id, index)
+        } else {
+            doc.get_node_mut(select_id)
+                .and_then(|node| node.data.downcast_element_mut())
+                .and_then(|el| el.select_data_mut())
+                .is_some_and(|data| data.set_selected(index, false))
+        };
+        if changed {
+            doc.snapshot_node(node_id);
+            doc.snapshot_node(select_id);
+        }
+        return Ok(JsValue::undefined());
+    }
+    drop(doc);
+
+    /*
+     * Before layout construction has run there is no live state, so a property
+     * write has to reach the attribute or the value is lost. `selected` is an
+     * HTML boolean attribute: present means selected whatever the value reads,
+     * which is the trap `checked` fell into where `checked="false"` came up on.
+     */
+    if selected {
+        write_attr(&ctx, node_id, "selected", "");
+    } else {
+        clear_attr(&ctx, node_id, "selected");
+    }
+    Ok(JsValue::undefined())
+}
+
 fn get_checked(this: &JsValue, _: &[JsValue], context: &mut Context) -> JsResult<JsValue> {
     let ctx = dom_ctx(context)?;
     let node_id = this_node_id(this)?;
diff --git a/packages/blitz-script/src/runtime.rs b/packages/blitz-script/src/runtime.rs
index 22f34862..8bb414d6 100644
--- a/packages/blitz-script/src/runtime.rs
+++ b/packages/blitz-script/src/runtime.rs
@@ -956,7 +956,12 @@ impl ScriptRuntime {
         // were covered, so `change` on a text field was dead, and a phone-number
         // field bound to it gated a Confirm button that nothing could open.
         let synthesise_change = match &event.data {
-            DomEventData::Input(_) => self.target_is_checkbox_or_radio(event.target),
+            DomEventData::Input(_) => {
+                // A select commits on selection, not on blur: the keystroke or
+                // the press is the commit, exactly as it is for a checkbox.
+                self.target_is_checkbox_or_radio(event.target)
+                    || self.target_is_select(event.target)
+            }
             DomEventData::Focus(_) => {
                 self.focussed_text_value = self
                     .text_control_value(event.target)
@@ -1014,6 +1019,14 @@ impl ScriptRuntime {
             .map(|input| input.editor.text().to_string())
     }
 
+    fn target_is_select(&self, node_id: NodeId) -> bool {
+        let doc = self.ctx.doc.borrow();
+        doc.get_node(node_id).is_some_and(|node| {
+            node.data
+                .is_element_with_tag_name(&blitz_dom::local_name!("select"))
+        })
+    }
+
     fn target_is_checkbox_or_radio(&self, node_id: NodeId) -> bool {
         let doc = self.ctx.doc.borrow();
         doc.get_node(node_id)
diff --git a/packages/blitz-script/tests/select_change.rs b/packages/blitz-script/tests/select_change.rs
new file mode 100644
index 00000000..be57cc16
--- /dev/null
+++ b/packages/blitz-script/tests/select_change.rs
@@ -0,0 +1,106 @@
+//! `change` on a `<select>`.
+//!
+//! `change` was synthesised only for checkbox and radio, so a picker fired
+//! nothing at all when the user chose something. A select commits immediately
+//! rather than on blur, like a checkbox and unlike a text control: the
+//! keystroke is the commit.
+
+use blitz_dom::{Document, DocumentConfig};
+use blitz_script::ScriptDocument;
+use blitz_traits::events::{BlitzKeyEvent, KeyState, UiEvent};
+use keyboard_types::{Code, Key, Location, Modifiers};
+
+fn doc_from_html(html: &str) -> ScriptDocument {
+    let mut doc = ScriptDocument::from_html(
+        html,
+        DocumentConfig {
+            viewport: Some(blitz_traits::shell::Viewport::new(
+                800,
+                600,
+                1.0,
+                blitz_traits::shell::ColorScheme::Light,
+            )),
+            ..Default::default()
+        },
+    );
+    // Resolve before the scripts run: the live selectedness a select reports
+    // is created by layout construction.
+    doc.inner_mut().resolve(0.0);
+    doc.execute_scripts();
+    doc
+}
+
+fn text_of(doc: &ScriptDocument, selector: &str) -> String {
+    let inner = doc.inner();
+    let node_id = inner
+        .query_selector(selector)
+        .unwrap()
+        .unwrap_or_else(|| panic!("no node matching {selector}"));
+    inner.get_node(node_id).unwrap().text_content()
+}
+
+fn key(key: Key, state: KeyState) -> BlitzKeyEvent {
+    BlitzKeyEvent {
+        key: key.clone(),
+        code: match key {
+            Key::ArrowDown => Code::ArrowDown,
+            Key::ArrowUp => Code::ArrowUp,
+            _ => Code::Unidentified,
+        },
+        modifiers: Modifiers::empty(),
+        location: Location::Standard,
+        is_auto_repeating: false,
+        is_composing: false,
+        state,
+        text: None,
+    }
+}
+
+const PAGE: &str = r#"
+    <html><body>
+        <select id="country">
+            <option value="us">United States</option>
+            <option value="fr">France</option>
+        </select>
+        <div id="out"></div>
+        <script>
+            const out = document.getElementById("out");
+            const select = document.getElementById("country");
+            select.addEventListener("input", () => { out.textContent += "input|"; });
+            select.addEventListener("change", (event) => {
+                out.textContent += "change:" + event.target.value + "|";
+            });
+        </script>
+    </body></html>
+"#;
+
+fn press_arrow_down(doc: &mut ScriptDocument) {
+    let select = doc.inner().query_selector("#country").unwrap().unwrap();
+    doc.inner_mut().set_focus_to(select);
+    doc.handle_ui_event(UiEvent::KeyDown(key(Key::ArrowDown, KeyState::Pressed)));
+    doc.handle_ui_event(UiEvent::KeyUp(key(Key::ArrowDown, KeyState::Released)));
+}
+
+#[test]
+fn a_keyboard_selection_fires_input_and_then_change() {
+    let mut doc = doc_from_html(PAGE);
+    press_arrow_down(&mut doc);
+
+    assert_eq!(
+        text_of(&doc, "#out"),
+        "input|change:fr|",
+        "a select commits on selection, so change must follow input immediately"
+    );
+}
+
+#[test]
+fn a_keystroke_that_changes_nothing_fires_nothing() {
+    let mut doc = doc_from_html(PAGE);
+    // Already on the last option after one press, so the second has nowhere to
+    // go: a select does not wrap, and an event for a selection that did not
+    // move would make every `change` listener fire on a no-op.
+    press_arrow_down(&mut doc);
+    press_arrow_down(&mut doc);
+
+    assert_eq!(text_of(&doc, "#out"), "input|change:fr|");
+}
diff --git a/packages/blitz-script/tests/select_properties.rs b/packages/blitz-script/tests/select_properties.rs
new file mode 100644
index 00000000..03566732
--- /dev/null
+++ b/packages/blitz-script/tests/select_properties.rs
@@ -0,0 +1,145 @@
+//! `HTMLSelectElement` and `HTMLOptionElement` properties.
+//!
+//! `HTMLSelectElement` existed only as an `instanceof` brand. `select.value`
+//! fell through to the generic attribute read, and a select has no `value`
+//! attribute, so every picker reported the empty string; there was no
+//! `selectedIndex`, no `options`, and no `option.selected` at all. A
+//! controlled component rendering a `<select>` from its own state could
+//! neither read what it showed nor drive it.
+
+use blitz_dom::{Document, DocumentConfig};
+use blitz_script::ScriptDocument;
+
+fn doc_from_html(html: &str) -> ScriptDocument {
+    let mut doc = ScriptDocument::from_html(
+        html,
+        DocumentConfig {
+            viewport: Some(blitz_traits::shell::Viewport::new(
+                800,
+                600,
+                1.0,
+                blitz_traits::shell::ColorScheme::Light,
+            )),
+            ..Default::default()
+        },
+    );
+    // Resolve before the scripts run: the live selectedness is created by
+    // layout construction, so a script that reads a select before the first
+    // resolve is reading the pre-construction fallback.
+    doc.inner_mut().resolve(0.0);
+    doc.execute_scripts();
+    doc
+}
+
+fn text_of(doc: &ScriptDocument, selector: &str) -> String {
+    let inner = doc.inner();
+    let node_id = inner
+        .query_selector(selector)
+        .unwrap()
+        .unwrap_or_else(|| panic!("no node matching {selector}"));
+    inner.get_node(node_id).unwrap().text_content()
+}
+
+const PICKER: &str = r#"
+    <select id="country">
+        <option value="us">United States</option>
+        <option value="fr" selected>France</option>
+        <option value="jp">Japan</option>
+    </select>
+    <div id="out"></div>
+"#;
+
+fn run(script: &str) -> String {
+    let doc = doc_from_html(&format!(
+        "<html><body>{PICKER}<script>const out = document.getElementById(\"out\");{script}</script></body></html>"
+    ));
+    text_of(&doc, "#out")
+}
+
+#[test]
+fn a_select_reports_the_selected_options_value() {
+    assert_eq!(
+        run(r#"out.textContent = document.getElementById("country").value;"#),
+        "fr"
+    );
+}
+
+#[test]
+fn a_select_reports_its_selected_index() {
+    assert_eq!(
+        run(r#"out.textContent = String(document.getElementById("country").selectedIndex);"#),
+        "1"
+    );
+}
+
+#[test]
+fn setting_value_moves_the_selection() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            select.value = "jp";
+            out.textContent = select.value + ":" + select.selectedIndex;
+        "#),
+        "jp:2"
+    );
+}
+
+#[test]
+fn setting_a_value_no_option_carries_clears_the_selection() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            select.value = "nowhere";
+            out.textContent = "[" + select.value + "]:" + select.selectedIndex;
+        "#),
+        "[]:-1",
+        "a value no option carries deselects everything, and selectedIndex is then -1"
+    );
+}
+
+#[test]
+fn setting_selected_index_moves_the_selection() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            select.selectedIndex = 0;
+            out.textContent = select.value;
+        "#),
+        "us"
+    );
+}
+
+#[test]
+fn options_lists_every_option_in_order() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            out.textContent = select.options.map((o) => o.value).join(",");
+        "#),
+        "us,fr,jp"
+    );
+}
+
+#[test]
+fn an_options_selected_property_reads_the_live_state() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            out.textContent = select.options.map((o) => o.selected).join(",");
+        "#),
+        "false,true,false"
+    );
+}
+
+#[test]
+fn setting_an_options_selected_property_moves_the_selection() {
+    assert_eq!(
+        run(r#"
+            const select = document.getElementById("country");
+            select.options[2].selected = true;
+            out.textContent = select.value + ":" + select.options.map((o) => o.selected).join(",");
+        "#),
+        "jp:false,false,true",
+        "selecting one option on a single select must clear the others"
+    );
+}
diff --git a/packages/stylo_taffy/src/convert.rs b/packages/stylo_taffy/src/convert.rs
index a9c5e817..7eba6f4a 100644
--- a/packages/stylo_taffy/src/convert.rs
+++ b/packages/stylo_taffy/src/convert.rs
@@ -149,6 +149,28 @@ pub fn inset(val: &stylo::InsetVal) -> taffy::LengthPercentageAuto {
     }
 }
 
+/// An inset, as the layout engine should see it for a box in `position`.
+///
+/// Taffy applies the inset of a `Relative` box as a displacement of its flow
+/// position. For `position: sticky` that is wrong twice over: the inset is a
+/// threshold rather than an offset, so a box that has not been scrolled past
+/// must not move at all, and the offset that does apply is measured from the
+/// scrollport rather than from the flow position. `position: sticky; top: 24px`
+/// was drawn 24px below where it belonged before anything had scrolled.
+///
+/// So sticky boxes reach taffy with no inset, and the engine reads the authored
+/// insets from the computed style when it applies the sticky adjustment.
+#[inline]
+pub fn inset_for_position(
+    position: stylo::Position,
+    val: &stylo::InsetVal,
+) -> taffy::LengthPercentageAuto {
+    if matches!(position, stylo::Position::Sticky) {
+        return taffy::LengthPercentageAuto::AUTO;
+    }
+    self::inset(val)
+}
+
 #[inline]
 pub fn is_block(input: stylo::Display) -> bool {
     matches!(input.outside(), stylo::DisplayOutside::Block)
@@ -226,9 +248,16 @@ pub fn position(input: stylo::Position) -> taffy::Position {
         stylo::Position::Relative => taffy::Position::Relative,
         stylo::Position::Static => taffy::Position::Relative,
 
-        // TODO: support position:fixed and sticky
+        // TODO: support position:fixed
         stylo::Position::Absolute => taffy::Position::Absolute,
         stylo::Position::Fixed => taffy::Position::Absolute,
+
+        // A sticky box lays out in flow and reserves its space there, which is
+        // exactly what `Relative` does. The offset that holds it against the
+        // edge of its scrollport is not a layout property at all: it depends on
+        // a scroll position, so it is applied after layout by the embedder.
+        // See `inset_for_position` for the half of that which taffy must not
+        // do on its own.
         stylo::Position::Sticky => taffy::Position::Relative,
     }
 }
@@ -698,11 +727,14 @@ pub fn to_taffy_style(style: &stylo::ComputedValues) -> taffy::Style<Atom> {
         },
         aspect_ratio: self::aspect_ratio(pos.aspect_ratio),
 
-        inset: taffy::Rect {
-            left: self::inset(&pos.left),
-            right: self::inset(&pos.right),
-            top: self::inset(&pos.top),
-            bottom: self::inset(&pos.bottom),
+        inset: {
+            let position = style.clone_position();
+            taffy::Rect {
+                left: self::inset_for_position(position, &pos.left),
+                right: self::inset_for_position(position, &pos.right),
+                top: self::inset_for_position(position, &pos.top),
+                bottom: self::inset_for_position(position, &pos.bottom),
+            }
         },
         margin: taffy::Rect {
             left: self::margin(&margin.margin_left),
diff --git a/packages/stylo_taffy/src/wrapper.rs b/packages/stylo_taffy/src/wrapper.rs
index aaebfa37..20940ef2 100644
--- a/packages/stylo_taffy/src/wrapper.rs
+++ b/packages/stylo_taffy/src/wrapper.rs
@@ -71,11 +71,12 @@ impl<T: Deref<Target = ComputedValues>> taffy::CoreStyle for TaffyStyloStyle<T>
     #[inline]
     fn inset(&self) -> taffy::Rect<taffy::LengthPercentageAuto> {
         let position_styles = self.0.get_position();
+        let position = self.0.get_box().position;
         taffy::Rect {
-            left: convert::inset(&position_styles.left),
-            right: convert::inset(&position_styles.right),
-            top: convert::inset(&position_styles.top),
-            bottom: convert::inset(&position_styles.bottom),
+            left: convert::inset_for_position(position, &position_styles.left),
+            right: convert::inset_for_position(position, &position_styles.right),
+            top: convert::inset_for_position(position, &position_styles.top),
+            bottom: convert::inset_for_position(position, &position_styles.bottom),
         }
     }
 
diff --git a/tests/blitz-tests/tests/fixed_position.rs b/tests/blitz-tests/tests/fixed_position.rs
index 0609537d..e04a4eba 100644
--- a/tests/blitz-tests/tests/fixed_position.rs
+++ b/tests/blitz-tests/tests/fixed_position.rs
@@ -179,3 +179,100 @@ fn fixed_descendant_of_flow_content_is_viewport_relative() {
     assert_eq!((rect.x, rect.y), (0.0, 0.0));
     assert_eq!((rect.width, rect.height), (1344.0, 900.0));
 }
+
+/// A fixed box must not scroll with the document.
+///
+/// Paint translates the whole tree by the negated viewport scroll, hoisted
+/// fixed layers included, so a fixed box held its document position and left
+/// the screen exactly like flow content: an overlay `top: 0` on a page scrolled
+/// 800px down painted at screen y=-800. Its document position has to track the
+/// scroll for its screen position to hold still.
+#[test]
+fn a_fixed_box_holds_its_place_when_the_page_scrolls() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="bar" style="position:fixed;top:0;left:0;width:100px;height:50px"></div>
+            <div style="height:5000px"></div>
+        </body></html>"#,
+    );
+
+    assert_box(&doc, "bar", (0.0, 0.0, 100.0, 50.0));
+
+    doc.scroll_viewport_by(0.0, -800.0);
+    doc.resolve(0.0);
+
+    // Paint subtracts the viewport scroll from every box, so a box that stays
+    // on screen is one whose document coordinate tracks it.
+    assert_box(&doc, "bar", (0.0, 800.0, 100.0, 50.0));
+
+    // Which is the same statement in viewport coordinates, where a client rect
+    // is what a page reads.
+    let bar = doc.get_element_by_id("bar").unwrap();
+    let rect = doc.get_client_bounding_rect(bar).unwrap();
+    assert_eq!((rect.x, rect.y), (0.0, 0.0));
+}
+
+/// The pin has to be recomputed, not accumulated: applying it twice would walk
+/// a fixed overlay down the page one scroll at a time.
+#[test]
+fn scrolling_twice_does_not_accumulate_the_pin() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="bar" style="position:fixed;top:0;left:0;width:100px;height:50px"></div>
+            <div style="height:5000px"></div>
+        </body></html>"#,
+    );
+
+    for _ in 0..4 {
+        doc.scroll_viewport_by(0.0, -200.0);
+        doc.resolve(0.0);
+    }
+    assert_box(&doc, "bar", (0.0, 800.0, 100.0, 50.0));
+
+    doc.scroll_viewport_by(0.0, 800.0);
+    doc.resolve(0.0);
+    assert_box(&doc, "bar", (0.0, 0.0, 100.0, 50.0));
+}
+
+/// A scroll on its own, with no resolve after it, still has to move the box.
+#[test]
+fn a_scroll_alone_pins_a_fixed_box() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="bar" style="position:fixed;top:0;left:0;width:100px;height:50px"></div>
+            <div style="height:5000px"></div>
+        </body></html>"#,
+    );
+
+    doc.scroll_viewport_by(0.0, -300.0);
+    assert_box(&doc, "bar", (0.0, 300.0, 100.0, 50.0));
+}
+
+/// A fixed box under a transformed ancestor is positioned against that ancestor
+/// rather than the viewport, so it scrolls with the page like any other content.
+#[test]
+fn a_fixed_box_under_a_transform_is_not_pinned() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="ancestor" style="transform:translate(0,0);width:300px;height:200px">
+                <div id="nested" style="position:fixed;top:10px;left:10px;width:120px;height:40px"></div>
+            </div>
+            <div style="height:5000px"></div>
+        </body></html>"#,
+    );
+
+    let before = {
+        let nested = doc.get_element_by_id("nested").unwrap();
+        doc.tree()[nested].absolute_position(0.0, 0.0).y
+    };
+
+    doc.scroll_viewport_by(0.0, -400.0);
+    doc.resolve(0.0);
+
+    let nested = doc.get_element_by_id("nested").unwrap();
+    assert_eq!(
+        doc.tree()[nested].absolute_position(0.0, 0.0).y,
+        before,
+        "a transformed ancestor is the containing block, so its fixed descendants scroll with it"
+    );
+}
diff --git a/tests/blitz-tests/tests/select_accessibility.rs b/tests/blitz-tests/tests/select_accessibility.rs
new file mode 100644
index 00000000..6fc5308c
--- /dev/null
+++ b/tests/blitz-tests/tests/select_accessibility.rs
@@ -0,0 +1,167 @@
+//! A `<select>` reports what it offers and what is chosen.
+//!
+//! The options were already in the accessibility tree, because the traversal
+//! walks raw children and `option { display: none }` therefore does not hide
+//! them, but they carried a role and nothing else. No label, no selectedness,
+//! and no value on the select itself, so a harness could see that a combo box
+//! existed and learn nothing further about it. worktables.dev's schema designer
+//! could not be driven at all for exactly this reason.
+
+use accesskit::{Node as AccessKitNode, NodeId, Role};
+use blitz_dom::DocumentConfig;
+use blitz_html::{HtmlDocument, HtmlProvider};
+use blitz_traits::shell::{ColorScheme, Viewport};
+use std::collections::HashMap;
+use std::sync::Arc;
+
+const PICKER: &str = r#"<html><body style="margin:0">
+    <select id="country">
+        <option id="us" value="us">United States</option>
+        <option id="fr" value="fr" selected>France</option>
+        <option id="jp" value="jp">Japan</option>
+    </select>
+</body></html>"#;
+
+/// The accessibility node of each element named by `ids`, in the order asked
+/// for.
+///
+/// Looked up by element id rather than read off the tree in order, because
+/// `build_accessibility_tree` collects through a `HashMap` and the nodes come
+/// back in whatever order that iterates.
+fn nodes_for(html: &str, ids: &[&str]) -> Vec<AccessKitNode> {
+    let mut doc = HtmlDocument::from_html(
+        html,
+        DocumentConfig {
+            viewport: Some(Viewport::new(800, 600, 1.0, ColorScheme::Light)),
+            html_parser_provider: Some(Arc::new(HtmlProvider) as _),
+            ..Default::default()
+        },
+    );
+    doc.resolve(0.0);
+
+    let by_id: HashMap<NodeId, AccessKitNode> =
+        doc.build_accessibility_tree().nodes.into_iter().collect();
+
+    ids.iter()
+        .map(|id| {
+            let node_id = doc
+                .get_element_by_id(id)
+                .unwrap_or_else(|| panic!("no element with id {id}"));
+            by_id
+                .get(&NodeId(node_id.as_u64()))
+                .unwrap_or_else(|| panic!("{id} is not in the accessibility tree"))
+                .clone()
+        })
+        .collect()
+}
+
+fn labels_and_selectedness(html: &str, ids: &[&str]) -> Vec<(String, Option<bool>)> {
+    nodes_for(html, ids)
+        .into_iter()
+        .map(|node| {
+            assert_eq!(node.role(), Role::ListBoxOption);
+            (
+                node.label().unwrap_or_default().to_string(),
+                node.is_selected(),
+            )
+        })
+        .collect()
+}
+
+#[test]
+fn options_reach_the_semantic_tree_with_their_labels() {
+    let labels: Vec<String> = labels_and_selectedness(PICKER, &["us", "fr", "jp"])
+        .into_iter()
+        .map(|(label, _)| label)
+        .collect();
+
+    assert_eq!(
+        labels,
+        vec![
+            "United States".to_string(),
+            "France".to_string(),
+            "Japan".to_string()
+        ],
+        "an option's accessible name must be its label, or a harness cannot tell what the select offers"
+    );
+}
+
+#[test]
+fn an_options_label_attribute_wins_over_its_text() {
+    let labels: Vec<String> = labels_and_selectedness(
+        r#"<html><body>
+            <select id="s"><option id="one" value="1" label="One">ignored</option></select>
+        </body></html>"#,
+        &["one"],
+    )
+    .into_iter()
+    .map(|(label, _)| label)
+    .collect();
+
+    assert_eq!(labels, vec!["One".to_string()]);
+}
+
+#[test]
+fn the_selected_option_is_marked_selected() {
+    assert_eq!(
+        labels_and_selectedness(PICKER, &["us", "fr", "jp"])
+            .into_iter()
+            .map(|(_, selected)| selected)
+            .collect::<Vec<_>>(),
+        vec![Some(false), Some(true), Some(false)],
+        "the `selected` content attribute must seed selectedness, and the others must read as not selected"
+    );
+}
+
+#[test]
+fn a_select_with_no_selected_attribute_falls_back_to_its_first_option() {
+    assert_eq!(
+        labels_and_selectedness(
+            r#"<html><body>
+                <select id="s">
+                    <option id="a" value="a">Alpha</option>
+                    <option id="b" value="b">Beta</option>
+                </select>
+            </body></html>"#,
+            &["a", "b"],
+        )
+        .into_iter()
+        .map(|(_, selected)| selected)
+        .collect::<Vec<_>>(),
+        vec![Some(true), Some(false)],
+        "a drop-down always displays something, so it must select its first option when nothing else does"
+    );
+}
+
+#[test]
+fn a_select_reports_its_current_label_as_its_value() {
+    let select = nodes_for(PICKER, &["country"]).remove(0);
+    assert_eq!(select.role(), Role::ComboBox);
+    assert_eq!(
+        select.value().map(str::to_string),
+        Some("France".to_string()),
+        "the combo box's value is what it displays, which is the selected option's label"
+    );
+}
+
+#[test]
+fn options_inside_an_optgroup_are_still_reached() {
+    assert_eq!(
+        labels_and_selectedness(
+            r#"<html><body>
+                <select id="s">
+                    <optgroup label="Europe">
+                        <option id="fr" value="fr">France</option>
+                        <option id="de" value="de">Germany</option>
+                    </optgroup>
+                </select>
+            </body></html>"#,
+            &["fr", "de"],
+        ),
+        vec![
+            ("France".to_string(), Some(true)),
+            ("Germany".to_string(), Some(false))
+        ],
+        "an <optgroup> nests its options one level down, and the flattened order is what selectedIndex counts"
+    );
+}
diff --git a/tests/blitz-tests/tests/select_keyboard.rs b/tests/blitz-tests/tests/select_keyboard.rs
new file mode 100644
index 00000000..a3a1c281
--- /dev/null
+++ b/tests/blitz-tests/tests/select_keyboard.rs
@@ -0,0 +1,133 @@
+//! Keyboard selection in a `<select>`.
+//!
+//! There was no keyboard activation for anything but a text input, so a
+//! focussed picker could not be driven at all. Worse, the arrows never even
+//! reached the keyboard handler: the KeyDown arm scrolls the page on
+//! ArrowUp/Down/Home/End and returns, and the predicate that lets a key through
+//! only knew about text inputs. A press on a select therefore scrolled the
+//! document instead of choosing anything.
+
+use blitz_test_harness::Harness;
+use keyboard_types::Key;
+
+const PICKER: &str = r#"<html><body style="margin:0; height:4000px">
+    <select id="country" style="width:150px; height:30px">
+        <option value="us">United States</option>
+        <option value="fr">France</option>
+        <option value="jp">Japan</option>
+    </select>
+</body></html>"#;
+
+fn value_of(harness: &Harness<blitz_html::HtmlDocument>, selector: &str) -> String {
+    let node_id = harness.node(selector);
+    harness.base().select_value(node_id)
+}
+
+fn focussed_picker(html: &str) -> Harness<blitz_html::HtmlDocument> {
+    let mut harness = Harness::from_html(html);
+    harness.click("#country");
+    assert_eq!(harness.focused(), Some(harness.node("#country")));
+    harness
+}
+
+#[test]
+fn arrow_down_moves_the_selection_forwards() {
+    let mut harness = focussed_picker(PICKER);
+    assert_eq!(value_of(&harness, "#country"), "us");
+
+    harness.press(Key::ArrowDown);
+    assert_eq!(
+        value_of(&harness, "#country"),
+        "fr",
+        "ArrowDown must move the selection on, not scroll the page"
+    );
+
+    harness.press(Key::ArrowDown);
+    assert_eq!(value_of(&harness, "#country"), "jp");
+}
+
+#[test]
+fn arrow_up_moves_the_selection_backwards() {
+    let mut harness = focussed_picker(PICKER);
+    harness.press(Key::End);
+    assert_eq!(value_of(&harness, "#country"), "jp");
+
+    harness.press(Key::ArrowUp);
+    assert_eq!(value_of(&harness, "#country"), "fr");
+}
+
+#[test]
+fn the_selection_does_not_wrap_past_either_end() {
+    let mut harness = focussed_picker(PICKER);
+    harness.press(Key::ArrowUp);
+    assert_eq!(
+        value_of(&harness, "#country"),
+        "us",
+        "at the first option ArrowUp must do nothing rather than wrap"
+    );
+
+    harness.press(Key::End);
+    harness.press(Key::ArrowDown);
+    assert_eq!(value_of(&harness, "#country"), "jp");
+}
+
+#[test]
+fn home_and_end_jump_to_the_first_and_last_option() {
+    let mut harness = focussed_picker(PICKER);
+    harness.press(Key::End);
+    assert_eq!(value_of(&harness, "#country"), "jp");
+
+    harness.press(Key::Home);
+    assert_eq!(value_of(&harness, "#country"), "us");
+}
+
+#[test]
+fn a_disabled_option_is_stepped_over() {
+    let mut harness = focussed_picker(
+        r#"<html><body style="margin:0; height:4000px">
+            <select id="country" style="width:150px; height:30px">
+                <option value="us">United States</option>
+                <option value="fr" disabled>France</option>
+                <option value="jp">Japan</option>
+            </select>
+        </body></html>"#,
+    );
+    assert_eq!(value_of(&harness, "#country"), "us");
+
+    harness.press(Key::ArrowDown);
+    assert_eq!(
+        value_of(&harness, "#country"),
+        "jp",
+        "a disabled option cannot be chosen, so the arrow steps over it"
+    );
+}
+
+#[test]
+fn arrows_move_the_selection_rather_than_scrolling_the_page() {
+    let mut harness = focussed_picker(PICKER);
+    let before = harness.base().viewport_scroll().y;
+
+    harness.press(Key::ArrowDown);
+
+    assert_eq!(
+        harness.base().viewport_scroll().y,
+        before,
+        "a focussed select claims the arrow keys; the page must not scroll under it"
+    );
+    assert_eq!(value_of(&harness, "#country"), "fr");
+}
+
+#[test]
+fn an_unfocussed_select_does_not_claim_the_arrows() {
+    let mut harness = Harness::from_html(PICKER);
+    let before = harness.base().viewport_scroll().y;
+
+    harness.press(Key::ArrowDown);
+
+    assert_ne!(
+        harness.base().viewport_scroll().y,
+        before,
+        "with nothing focussed the arrows must still scroll the document"
+    );
+    assert_eq!(value_of(&harness, "#country"), "us");
+}
diff --git a/tests/blitz-tests/tests/select_layout.rs b/tests/blitz-tests/tests/select_layout.rs
index 208aea44..e500e4b4 100644
--- a/tests/blitz-tests/tests/select_layout.rs
+++ b/tests/blitz-tests/tests/select_layout.rs
@@ -64,3 +64,44 @@ fn a_bare_select_still_gets_a_box() {
         "a select with no authored size must still be hittable, got {width}x{height}"
     );
 }
+
+#[test]
+fn a_labelled_option_is_measured_by_its_label() {
+    // The `label` attribute is what the control shows; the element's text is
+    // not displayed at all. Measuring the text sized the box to a string the
+    // reader never sees.
+    let doc = doc(r#"<html><body style="margin:0; line-height:normal">
+            <select id="short"><option label="X">A considerably longer hidden string</option></select>
+            <select id="long"><option>A considerably longer hidden string</option></select>
+        </body></html>"#);
+
+    let (short_width, _) = size_of(&doc, "#short");
+    let (long_width, _) = size_of(&doc, "#long");
+    assert!(
+        short_width < long_width / 4.0,
+        "the labelled select must be sized from its one-character label, got {short_width} against {long_width}"
+    );
+}
+
+#[test]
+fn an_option_written_across_several_lines_is_not_measured_wider_for_it() {
+    // The whitespace inside the label is collapsed away when it is rendered,
+    // so it must not be counted. `trim()` only strips the ends: a label whose
+    // own words are split across lines kept the newline and the run of leading
+    // spaces before the next word, and the control came out that much wider.
+    let indented = doc(r#"<html><body style="margin:0; line-height:normal">
+            <select id="country">
+                <option value="us">United
+                    States</option>
+            </select>
+        </body></html>"#);
+    let inline = doc(r#"<html><body style="margin:0; line-height:normal">
+            <select id="country"><option value="us">United States</option></select>
+        </body></html>"#);
+
+    assert_eq!(
+        size_of(&indented, "#country").0,
+        size_of(&inline, "#country").0,
+        "how the markup is formatted must not change how wide the control is"
+    );
+}
diff --git a/tests/blitz-tests/tests/select_selection.rs b/tests/blitz-tests/tests/select_selection.rs
new file mode 100644
index 00000000..1077e9cc
--- /dev/null
+++ b/tests/blitz-tests/tests/select_selection.rs
@@ -0,0 +1,155 @@
+//! A `<select>` can be focussed and its selection is what the form submits.
+//!
+//! `handle_click` had no arm for a select, so the walk fell through to the
+//! no-match tail, which calls `clear_focus()`. Pressing a select therefore
+//! actively unfocused the page, and since the keyboard handler is gated on
+//! focus, the arrows could not drive a control the user had just pressed.
+//!
+//! Form submission had a standing TODO exactly where a select's serialization
+//! belongs, so a select fell through to the generic tail and submitted its own
+//! literal `value` attribute, which a select does not have.
+
+use blitz_dom::DocumentConfig;
+use blitz_html::{HtmlDocument, HtmlProvider};
+use blitz_test_harness::Harness;
+use blitz_traits::navigation::{NavigationOptions, NavigationProvider};
+use blitz_traits::shell::{ColorScheme, Viewport};
+use std::sync::{Arc, Mutex};
+
+const PICKER: &str = r#"<html><body style="margin:0">
+    <select id="country" style="width:150px; height:30px">
+        <option value="us">United States</option>
+        <option value="fr" selected>France</option>
+    </select>
+</body></html>"#;
+
+#[test]
+fn clicking_a_select_focuses_it() {
+    let mut harness = Harness::from_html(PICKER);
+    let select = harness.node("#country");
+    harness.click("#country");
+
+    assert_eq!(
+        harness.focused(),
+        Some(select),
+        "a press must focus the select; without it the keyboard handler, which is gated on focus, can never reach it"
+    );
+}
+
+#[test]
+fn clicking_a_select_does_not_clear_an_existing_focus() {
+    let mut harness = Harness::from_html(
+        r#"<html><body style="margin:0">
+            <input id="name" type="text" style="width:100px; height:20px">
+            <select id="country" style="width:150px; height:30px">
+                <option value="us">United States</option>
+            </select>
+        </body></html>"#,
+    );
+    harness.click("#name");
+    assert_eq!(harness.focused(), Some(harness.node("#name")));
+
+    harness.click("#country");
+    assert_eq!(
+        harness.focused(),
+        Some(harness.node("#country")),
+        "the press must move focus to the select rather than clearing it"
+    );
+}
+
+#[derive(Default)]
+struct RecordingNavigation {
+    urls: Mutex<Vec<String>>,
+}
+
+impl NavigationProvider for RecordingNavigation {
+    fn navigate_to(&self, options: NavigationOptions) {
+        self.urls
+            .lock()
+            .unwrap()
+            .push(options.url.as_str().to_string());
+    }
+}
+
+/// Submit the form and return the URL the navigation provider was handed.
+fn submitted_url(html: &str) -> String {
+    let navigation = Arc::new(RecordingNavigation::default());
+    let mut doc = HtmlDocument::from_html(
+        html,
+        DocumentConfig {
+            viewport: Some(Viewport::new(800, 600, 1.0, ColorScheme::Light)),
+            html_parser_provider: Some(Arc::new(HtmlProvider) as _),
+            navigation_provider: Some(navigation.clone()),
+            base_url: Some("https://example.test/page".to_string()),
+            ..Default::default()
+        },
+    );
+    doc.resolve(0.0);
+    let form = doc.query_selector("#form").unwrap().unwrap();
+    let submitter = doc.query_selector("#go").unwrap().unwrap();
+    doc.submit_form(form, submitter);
+
+    let urls = navigation.urls.lock().unwrap();
+    assert_eq!(urls.len(), 1, "expected exactly one navigation");
+    urls[0].clone()
+}
+
+#[test]
+fn a_form_submits_the_selected_options_value() {
+    let url = submitted_url(
+        r#"<html><body>
+            <form id="form" action="/search" method="get">
+                <select id="country" name="country">
+                    <option value="us">United States</option>
+                    <option value="fr" selected>France</option>
+                </select>
+                <button id="go" type="submit">Go</button>
+            </form>
+        </body></html>"#,
+    );
+
+    assert_eq!(
+        url, "https://example.test/search?country=fr",
+        "the entry must be the selected option's value, not the select's own (absent) value attribute"
+    );
+}
+
+#[test]
+fn an_option_with_no_value_attribute_submits_its_label() {
+    let url = submitted_url(
+        r#"<html><body>
+            <form id="form" action="/search" method="get">
+                <select id="size" name="size">
+                    <option>Small</option>
+                    <option selected>Large</option>
+                </select>
+                <button id="go" type="submit">Go</button>
+            </form>
+        </body></html>"#,
+    );
+
+    assert_eq!(url, "https://example.test/search?size=Large");
+}
+
+#[test]
+fn a_disabled_option_is_never_submitted() {
+    // `multiple` so that both options can carry `selected` at once: the point
+    // of the case is that the disabled one is dropped while the other is kept,
+    // which a single select could not express.
+    let url = submitted_url(
+        r#"<html><body>
+            <form id="form" action="/search" method="get">
+                <select id="country" name="country" multiple>
+                    <option value="us" selected disabled>United States</option>
+                    <option value="fr" selected>France</option>
+                </select>
+                <button id="go" type="submit">Go</button>
+            </form>
+        </body></html>"#,
+    );
+
+    assert_eq!(
+        url, "https://example.test/search?country=fr",
+        "a disabled option is skipped by the entry construction steps even when it is selected"
+    );
+}
diff --git a/tests/blitz-tests/tests/sticky_position.rs b/tests/blitz-tests/tests/sticky_position.rs
new file mode 100644
index 00000000..7e0a0105
--- /dev/null
+++ b/tests/blitz-tests/tests/sticky_position.rs
@@ -0,0 +1,332 @@
+//! `position: sticky` has to pin a box inside the scrollport it lives in.
+//!
+//! `stylo_taffy` mapped `Position::Sticky` onto `taffy::Position::Relative`, so
+//! a sticky box laid out in flow and then scrolled away like any other. Every
+//! sticky navbar and document sidebar on the fleet scrolled off the top of
+//! documents 5,000 to 16,700px tall.
+//!
+//! Relative is the right *layout* answer: a sticky box takes its flow position
+//! and reserves its space there. What was missing is the adjustment on top of
+//! it, which the tests below pin down: nothing before the threshold, a pin
+//! after it, and a release when the containing block leaves.
+
+use blitz_dom::DocumentConfig;
+use blitz_html::{HtmlDocument, HtmlProvider};
+use blitz_traits::shell::{ColorScheme, Viewport};
+use std::sync::Arc;
+
+const VIEWPORT: (u32, u32) = (1000, 700);
+
+fn document(html: &str) -> HtmlDocument {
+    let mut doc = HtmlDocument::from_html(
+        html,
+        DocumentConfig {
+            viewport: Some(Viewport::new(
+                VIEWPORT.0,
+                VIEWPORT.1,
+                1.0,
+                ColorScheme::Light,
+            )),
+            html_parser_provider: Some(Arc::new(HtmlProvider) as _),
+            ..Default::default()
+        },
+    );
+    doc.resolve(0.0);
+    doc
+}
+
+/// Scroll the viewport down by `amount` CSS pixels.
+///
+/// `scroll_viewport_by` takes a wheel delta, which points the other way.
+fn scroll_down(doc: &mut HtmlDocument, amount: f64) {
+    doc.scroll_viewport_by(0.0, -amount);
+}
+
+#[track_caller]
+fn origin(doc: &HtmlDocument, id: &str) -> (f32, f32) {
+    let node_id = doc
+        .get_element_by_id(id)
+        .unwrap_or_else(|| panic!("no element with id {id}"));
+    let position = doc.tree()[node_id].absolute_position(0.0, 0.0);
+    (position.x, position.y)
+}
+
+/// A sticky box that has not reached its threshold sits exactly where a
+/// `position: relative` box with no insets would: at its flow position.
+///
+/// The insets are a threshold, not an offset. Taffy applies the inset of a
+/// `Relative` box as a displacement, so `position:sticky;top:24px` was drawn
+/// 24px below its flow position before anything had scrolled at all.
+#[test]
+fn an_unreached_threshold_leaves_the_box_in_flow() {
+    let doc = document(
+        r#"<html><body style="margin:0">
+            <div style="height:100px"></div>
+            <div id="header" style="position:sticky;top:24px;height:50px"></div>
+            <div style="height:3000px"></div>
+        </body></html>"#,
+    );
+
+    assert_eq!(
+        origin(&doc, "header"),
+        (0.0, 100.0),
+        "an inset is a threshold, not a relative displacement"
+    );
+}
+
+/// The headline case: a sticky header on a document taller than the viewport.
+#[test]
+fn a_sticky_header_pins_once_the_page_scrolls_past_it() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <header id="header" style="position:sticky;top:0;height:50px"></header>
+            <main style="height:5000px"></main>
+        </body></html>"#,
+    );
+
+    assert_eq!(origin(&doc, "header"), (0.0, 0.0));
+
+    scroll_down(&mut doc, 800.0);
+    doc.resolve(0.0);
+
+    // Document coordinates: paint subtracts the viewport scroll, so a box that
+    // stays at the top of the screen has to track it.
+    assert_eq!(
+        origin(&doc, "header"),
+        (0.0, 800.0),
+        "a sticky header must stay at the top of the scrollport"
+    );
+
+    scroll_down(&mut doc, 700.0);
+    doc.resolve(0.0);
+    assert_eq!(origin(&doc, "header"), (0.0, 1500.0));
+}
+
+/// A `top` inset is a distance from the top of the scrollport, so the pinned
+/// position is the scroll offset plus the inset.
+#[test]
+fn a_top_inset_offsets_the_pinned_position() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="header" style="position:sticky;top:24px;height:50px"></div>
+            <div style="height:5000px"></div>
+        </body></html>"#,
+    );
+
+    scroll_down(&mut doc, 600.0);
+    doc.resolve(0.0);
+
+    assert_eq!(origin(&doc, "header"), (0.0, 624.0));
+}
+
+/// Stickiness ends where the containing block does. A box pinned forever would
+/// escape its own section and float over the next one.
+#[test]
+fn the_box_leaves_with_its_containing_block() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <section id="section" style="height:1000px">
+                <div id="header" style="position:sticky;top:0;height:50px"></div>
+            </section>
+            <section style="height:5000px"></section>
+        </body></html>"#,
+    );
+
+    // Inside the section, pinned to the top of the scrollport.
+    scroll_down(&mut doc, 400.0);
+    doc.resolve(0.0);
+    assert_eq!(origin(&doc, "header"), (0.0, 400.0));
+
+    // The last position at which the box still fits inside its section is
+    // 1000 - 50 = 950.
+    scroll_down(&mut doc, 550.0);
+    doc.resolve(0.0);
+    assert_eq!(origin(&doc, "header"), (0.0, 950.0));
+
+    // Past that it travels with the section rather than pinning forever.
+    scroll_down(&mut doc, 500.0);
+    doc.resolve(0.0);
+    assert_eq!(
+        origin(&doc, "header"),
+        (0.0, 950.0),
+        "a sticky box must not outlive its containing block"
+    );
+}
+
+/// A `bottom` inset pins against the bottom edge of the scrollport, which means
+/// a box further down the document than the scrollport's bottom edge is pulled
+/// *up* to sit on it, and released once the page scrolls far enough that its
+/// flow position rises above the line.
+#[test]
+fn a_bottom_inset_pins_against_the_bottom_of_the_scrollport() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div style="height:5000px"></div>
+            <div id="footer" style="position:sticky;bottom:0;height:50px"></div>
+        </body></html>"#,
+    );
+
+    // The scrollport bottom is at document y=700, so the box's own bottom is
+    // held there and its top lands at 650 rather than its flow position 5000.
+    assert_eq!(origin(&doc, "footer"), (0.0, 650.0));
+
+    scroll_down(&mut doc, 400.0);
+    doc.resolve(0.0);
+    assert_eq!(origin(&doc, "footer"), (0.0, 1050.0));
+
+    // The document is 5050 tall, so 4350 is the last scroll position. There the
+    // flow position and the pinned position coincide and the box is released.
+    scroll_down(&mut doc, 3950.0);
+    doc.resolve(0.0);
+    assert_eq!(origin(&doc, "footer"), (0.0, 5000.0));
+}
+
+/// Horizontal stickiness works the same way against a horizontally scrolling
+/// container.
+#[test]
+fn a_left_inset_pins_horizontally() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div id="scroller" style="width:400px;height:200px;overflow:auto">
+                <div style="width:3000px;height:100px;padding-left:100px">
+                    <div id="label" style="position:sticky;left:10px;width:60px;height:20px"></div>
+                </div>
+            </div>
+        </body></html>"#,
+    );
+
+    // Flow position 100 is to the right of the threshold at x=10, so nothing
+    // moves.
+    assert_eq!(origin(&doc, "label"), (100.0, 0.0));
+
+    let scroller = doc.get_element_by_id("scroller").unwrap();
+    doc.scroll_node_by(scroller, -250.0, 0.0, |_| {});
+    doc.resolve(0.0);
+
+    // The scroller's content has moved 250px left, taking the flow position to
+    // -150, so the label is held 10px from the scrollport's left edge.
+    assert_eq!(origin(&doc, "label"), (10.0, 0.0));
+}
+
+/// A `right` inset is the mirror of `left`: the box is pulled back towards the
+/// left edge of the scrollport as content to its right scrolls into view.
+#[test]
+fn a_right_inset_pins_against_the_right_of_the_scrollport() {
+    let doc = document(
+        r#"<html><body style="margin:0">
+            <div id="scroller" style="width:400px;height:200px;overflow:auto">
+                <div style="width:3000px;height:100px">
+                    <div id="label" style="position:sticky;right:20px;margin-left:2000px;width:60px;height:20px"></div>
+                </div>
+            </div>
+        </body></html>"#,
+    );
+
+    // The scrollport's right edge is at x=400, so the box's own right edge is
+    // held at 380 and its left edge lands at 320, rather than at its flow
+    // position of 2000.
+    assert_eq!(origin(&doc, "label"), (320.0, 0.0));
+}
+
+/// A sticky box in a nested scroller sticks to *that* scrollport, not to the
+/// viewport. The document is not scrolled here at all.
+#[test]
+fn stickiness_is_relative_to_the_nearest_scrollport() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <div style="height:100px"></div>
+            <div id="scroller" style="height:300px;overflow:auto">
+                <div id="header" style="position:sticky;top:0;height:40px"></div>
+                <div style="height:2000px"></div>
+            </div>
+        </body></html>"#,
+    );
+
+    assert_eq!(origin(&doc, "header"), (0.0, 100.0));
+
+    let scroller = doc.get_element_by_id("scroller").unwrap();
+    doc.scroll_node_by(scroller, 0.0, -500.0, |_| {});
+    doc.resolve(0.0);
+
+    // The scroller's box starts at y=100 and is not itself scrolled by the
+    // page, so its scrollport top stays at 100.
+    assert_eq!(
+        origin(&doc, "header"),
+        (0.0, 100.0),
+        "a sticky box in a scroller pins to that scroller, not to the viewport"
+    );
+}
+
+/// The adjustment has to survive a relayout that does not move anything, and
+/// must not accumulate: applying it twice against an already-adjusted box would
+/// walk the header down the page one scroll at a time.
+#[test]
+fn repeated_resolves_do_not_accumulate_the_offset() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <header id="header" style="position:sticky;top:0;height:50px"></header>
+            <main style="height:5000px"></main>
+        </body></html>"#,
+    );
+
+    scroll_down(&mut doc, 900.0);
+    for _ in 0..5 {
+        doc.resolve(0.0);
+        assert_eq!(origin(&doc, "header"), (0.0, 900.0));
+    }
+
+    // The non-incremental path rebuilds every box from scratch each pass.
+    doc.set_incremental_layout(false);
+    for _ in 0..5 {
+        doc.resolve(0.0);
+        assert_eq!(origin(&doc, "header"), (0.0, 900.0));
+    }
+}
+
+/// A scroll on its own, with no intervening resolve, still has to move the box:
+/// a wheel event does not necessarily produce a full style and layout pass.
+#[test]
+fn a_scroll_alone_repositions_the_box() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <header id="header" style="position:sticky;top:0;height:50px"></header>
+            <main style="height:5000px"></main>
+        </body></html>"#,
+    );
+
+    scroll_down(&mut doc, 300.0);
+    assert_eq!(origin(&doc, "header"), (0.0, 300.0));
+}
+
+/// Hit testing has to follow the box. A pinned header is the thing under the
+/// pointer at the top of the screen, not whatever content scrolled beneath it.
+#[test]
+fn a_pinned_header_takes_the_hit() {
+    let mut doc = document(
+        r#"<html><body style="margin:0">
+            <header id="header" style="position:sticky;top:0;height:50px"></header>
+            <main id="body-copy" style="height:5000px"></main>
+        </body></html>"#,
+    );
+
+    scroll_down(&mut doc, 800.0);
+    doc.resolve(0.0);
+
+    let header = doc.get_element_by_id("header").unwrap();
+    // Hit tests take page coordinates. Screen point (20, 10) is page point
+    // (20, 810) once the scroll is added back, which is inside the pinned
+    // header.
+    let hit_node = doc
+        .hit(20.0, 810.0)
+        .expect("nothing under the pointer")
+        .node_id;
+
+    let mut ancestor = Some(hit_node);
+    while let Some(id) = ancestor {
+        if id == header {
+            return;
+        }
+        ancestor = doc.tree()[id].parent;
+    }
+    panic!("expected the pinned header under the pointer, got node {hit_node:?}");
+}